JSON-LD 结构化数据基础
使用 JSON-LD 添加机器可读的结构化数据
JSON-LD 结构化数据基础 是 CoddyKit 上的免费 HTML Academy 课时。 这是第 3 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 HTML Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 HTML Academy 课程共包含 4 节课。
什么是结构化数据
结构化数据是描述页面主题的机器可读 JSON,例如文章、食谱、产品或活动。搜索引擎会利用它渲染富结果(星级评分、食谱卡片、面包屑导航),而不是只显示普通的蓝色链接。
JSON-LD 是推荐格式
Google 推荐的格式是 JSON-LD:在 head 或 body 中放置一个 <script type="application/ld+json"> 块,其中包含一个或多个 schema.org 对象。它与可见 HTML 解耦,因此添加或更新它不需要重写模板。
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Article",
"headline": "Learn HTML",
"author": { "@type": "Person", "name": "Ada Lovelace" },
"datePublished": "2024-05-01"
}
</script>@context 和 @type
每个 JSON-LD 对象都需要 @context(几乎总是“https://schema.org”)和 @type(schema.org 类别:Article、Recipe、Product、FAQPage)。@context 会告诉解析器属性名称来自哪种词汇表。
常见的 Article 属性
对于 Article,请提供 headline、image(URL 或数组)、datePublished、dateModified、author(Person 或 Organization 对象)以及 publisher(带 logo 的 Organization)。这些是 Google 的头条新闻轮播考虑该页面所需的最少字段。
产品架构
产品页面应声明 @type Product,并提供 name、image、description、brand、sku,以及包含 price、priceCurrency 和 availability 的 offers 子对象。结合 aggregateRating 后,Google 就能直接在搜索结果中呈现星级评分和价格摘要。
{
"@context": "https://schema.org",
"@type": "Product",
"name": "Coddy Plus",
"offers": { "@type": "Offer", "price": "29.00", "priceCurrency": "USD" }
}面包屑架构
BreadcrumbList 描述导航层级。每个 itemListElement 都是一个包含 position、name 和 item(URL)的 ListItem。存在这些数据时,Google 会将摘要中的 URL 行替换为带标签的面包屑路径,从而获得更多点击。
FAQ 和 HowTo
FAQPage 和 HowTo 架构此前会在 SERP 中解锁富结果组件。谷歌后来将 FAQ 富结果限制为少数网站类别(政府类、教育类),但这种标记对语音助手和其他使用方仍然很有价值——请在真正的 FAQ 页面上保留它。
匹配可见页面
谷歌会惩罚与用户所见内容不匹配的标记。不要声明页面上没有显示的五星评分;也不要列出用户根本看不到的 9.99 美元价格。结构化数据必须准确描述渲染后的内容。
使用富结果测试进行验证
谷歌的富结果测试(search.google.com/test/rich-results)可以解析任何网址或粘贴的代码,列出检测到的架构类型,并警告缺少的必需属性。在部署任何结构化数据更改之前运行它。
每页使用多个架构
您可以在同一页面声明多个 JSON-LD 区块(例如 Article + BreadcrumbList + Organization),也可以将它们合并到一个 @graph 数组中。两种形式都有效;请选择在构建流水线中更容易套用模板的一种。
更新而不重新渲染
JSON-LD 位于与可见内容分开的脚本标签中。要更新它,请重新生成 JSON 区块——不要只通过客户端 JavaScript 注入结构化数据,因为谷歌抓取工具在建立索引之前不一定能可靠地执行 JS。
知识检查
要使每个 JSON-LD 对象成为有效的结构化数据,必须包含哪两个顶层属性?
总结
JSON-LD 会在单个 application/ld+json 脚本区块中声明结构化数据,并使用 @context 和 @type 标识每个对象。常见架构(Article、Product、BreadcrumbList)会在标记准确反映可见页面时解锁丰富的搜索结果。部署前请使用富结果测试进行验证。
常见问题解答
「JSON-LD 结构化数据基础」课时是免费的吗?
是的 — 「JSON-LD 结构化数据基础」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 HTML Academy 课程的其余内容,请升级到 CoddyKit PRO。 HTML Academy 课程共包含 4 节课。
「JSON-LD 结构化数据基础」这节课中我会学到什么?
使用 JSON-LD 添加机器可读的结构化数据 你通过在浏览器中直接运行的动手代码来练习 HTML Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 HTML Academy 需要有经验吗?
无需任何先前经验。CoddyKit 上的 HTML Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 3 节课,共 4 节。
「JSON-LD 结构化数据基础」课时需要多长时间?
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。
我能在这节 HTML Academy 课中编写并运行代码吗?
能。每节 HTML Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。