如何用HTML代码在head区域正确添加JSON-LD结构化数据-html教程-PHP中文网

json-ld必须置于内独立标签中，纯json格式、无注释/html实体/js语句，多片段需分标签，动态内容须json转义，验证须用google url inspection或schema.org验证器。

如何用html代码在head区域正确添加json-ld结构化数据

JSON-LD 必须放在里，但不能放错位置

直接写在开始后、前即可，Google 推荐且只认这个位置。别塞进，也别用 document.write 或 JS 动态注入——那些不会被爬虫解析。

常见错误是把 JSON-LD 放在 <script type="application/ld+json"></script> 外面加了注释、空行或 HTML 标签，导致 JSON 格式损坏。只要 <script></script> 标签内容是纯 JSON（不含任何 HTML 实体、换行符转义、JS 语句），就没问题。

<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebSite","name":"My Site"}</script> ✅
<script type="application/ld+json">// 这里不能有注释{"@type":"WebSite"}</script> ❌
<script type="application/ld+json"> {"@type":"WebSite"}</script> ❌（HTML 空格实体会破坏 JSON）

多个 JSON-LD 片段要各自独立 `<script></script>` 标签

一个页面可以有多个结构化数据片段（比如同时声明 WebSite 和 Organization），但必须每个都用单独的 <script type="application/ld+json"></script> 包裹。不能合并成一个数组，也不能用逗号拼接。

原因：Google 的解析器按 <script></script> 标签粒度读取，合并后要么语法错误，要么只识别第一个对象。

✅ 正确写法：

<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebSite","url":"https://example.com/"}</script>

<script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Acme Corp"}</script>

❌ 错误写法：

{"@context":"https://schema.org","@type":"WebSite"}{"@context":"https://schema.org","@type":"Organization"}

❌ 错误写法：
```
[{"@type":"WebSite"},{"@type":"Organization"}]
```
（数组格式不被支持）

特殊字符和变量注入必须提前转义

如果 JSON-LD 中要插入动态内容（如页面标题、URL、描述），需确保所有双引号、反斜杠、换行符都被 JSON-safe 转义。尤其注意 CMS 或模板引擎可能自动 HTML-encode，结果输出 " 而不是 "，直接导致 JSON 解析失败。

html-deploy

使用 htmlcode.fun 将 HTML 内容或文件部署到网页，适用于用户要求“部署到网页”“托管此 HTML”“生成此前端...的实时链接”等场景。

下载

建议：服务端渲染时用语言原生 JSON 库生成（如 PHP 的 json_encode()、Python 的 json.dumps()），前端 JS 拼接时用 JSON.stringify()，别手动拼字符串。

❌ "description": "<p>Hello & World</p>"（HTML 实体未还原）
✅ "description": "Hello & World"（纯文本，& 是合法 HTML 字符，但 JSON 内应为 &，不是 &）
✅ 更稳妥："description": ""（服务端模板）

验证时别只看浏览器源码，要用 Google Rich Results Test

浏览器“查看页面源代码”看到 JSON-LD 存在，不代表 Google 能正确提取。常见干扰因素包括：HTTP 响应头 Content-Type 缺失或错误、gzip 压缩损坏、CDN 缓存了旧版 HTML、<script></script> 标签被某些插件或优化工具误删。

真正有效的验证方式只有两个：Google Rich Results Test（已停用，迁至 Google Search Console > URL Inspection）和 Schema Markup Validator（validator.schema.org）。它们会模拟 Googlebot 抓取并解析，暴露真实问题。

最容易被忽略的是：本地开发时用 file:// 协议打开 HTML，这些工具根本无法加载，必须部署到 HTTP/HTTPS 服务下测试。