HTML代码中schema结构化数据嵌入-html教程-PHP中文网

绝大多数场景下必须用，因其支持完整嵌套对象（如article含author、image等），而仅能表达单值，不被google识别为有效结构化数据主体。

html代码中schema结构化数据嵌入

schema.org结构化数据该用<script type="application/ld+json">还是<meta>？</script>

绝大多数场景下，必须用 <script type="application/ld+json"></script>，<meta>（哪怕带itemprop）只适用于极简属性，且不被Google等主流搜索引擎完整识别为结构化数据主体。

原因很简单：schema.org规范要求机器可解析的完整JSON-LD对象，而<meta>只能表达单个键值对，无法描述嵌套类型（比如Article里包含author、publisher、image等子对象）。Google Structured Data Testing Tool 会直接忽略仅靠<meta itemprop="name">拼凑的片段。

✅ 正确做法：把整个Article或Organization对象写成合法JSON，包裹在<script type="application/ld+json"></script>中，放在或底部均可
❌ 常见错误：混用Microdata（itemscope/itemprop）和JSON-LD，导致同一页面出现重复或冲突的@type，Google可能随机选一个或全部降权
⚠️ 注意：JSON必须严格合法——字符串用双引号、末尾不能多逗号、@context必须是"https://schema.org"（小写s，不能写成http或Schema.org）

如何验证嵌入的schema是否生效？

别信浏览器“查看源代码”里看起来整齐就代表OK——JSON-LD一旦有语法错误，搜索引擎会静默丢弃整段脚本，不报错也不提示。

必须用官方工具实时验证：

HTML Extract

使用 MinerU 从 HTML 页面和文件中提取内容，将 HTML 转换为保持标题、列表、表格及文本层次结构的干净、结构化 Markdown。F...

下载

Google Search Console 的 URL Inspection 工具 → 输入页面地址 → 查看“增强型结果”卡片下的“结构化数据”部分（不是“测试”按钮，那是旧版）
独立验证用 https://search.google.com/search/howsearchworks/test-your-structured-data（注意：此链接已替换旧的Rich Results Test）
本地快速检查：把JSON-LD内容复制进 https://jsonlint.com/，确认无语法错误；再粘贴到验证工具里，重点看是否有Missing field警告（比如datePublished缺失但Article类型强制要求）

动态生成的页面怎么安全注入schema？

服务端渲染（SSR）或静态站点生成器（如Next.js、Hugo）可直接输出JSON-LD脚本；但纯前端JS渲染的页面（如React/Vue SPA），必须确保schema在首次HTML响应中就存在，不能等useEffect或mounted后才插入<script></script>。

原因：Googlebot抓取的是初始HTML快照，不执行JS（除非明确启用JavaScript渲染，但结构化数据不在此列）。

✅ React推荐：用next/head（Next.js）或react-helmet在服务端/SSG阶段注入；Vue用<script setup></script>配合useHead（Nuxt 3）
❌ 错误做法：在componentDidMount里用document.createElement('script')动态追加——Google看不到
⚠️ 特别注意时间字段：datePublished、dateModified必须是ISO 8601格式（如"2024-05-20T14:30:00+08:00"），不能是"2024/05/20"或new Date().toISOString()（后者在客户端运行时生成，SSR环境会出错）

多个schema类型能共存吗？怎么避免冲突？

可以共存，但必须满足两个硬性条件：每个<script type="application/ld+json"></script>块只声明一个顶层@type，且所有块之间不能有逻辑重叠（比如同一页面同时声明WebPage和Article，但Article的mainEntityOfPage没指向该WebPage的@id）。

✅ 安全做法：用@id显式关联——例如Article块里写"mainEntityOfPage": {"@id": "https://example.com/post#webpage"}，再单独一个WebPage块，"@id": "https://example.com/post#webpage"
❌ 危险操作：把Organization和Article塞进同一个JSON对象，用数组包装——JSON-LD不支持这种“多类型根节点”，解析器会失败
⚠️ 隐藏坑：CMS自动生成的schema（如WordPress插件）可能默认注入WebSite，你手动加的Article若没设mainEntityOfPage，Google会认为这是两个无关页面，影响排名