JSON-LD

JSON-LD 是 W3C 推荐标准，用 JSON 格式表达语义链接数据，与 HTML 内容分离，便于维护。

JSON-LD 基础

核心概念

text

JSON-LD = JSON + 语义链接：
- @context：词汇表/上下文
- @type：资源类型
- @id：资源标识符
- 属性名：语义化键名
- 属性值：数据值或嵌套对象

基本结构

HTML

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Person",
  "name": "张三",
  "jobTitle": "前端工程师",
  "email": "zhangsan@example.com"
}
</script>

核心属性

属性	说明
@context	词汇表URL，定义属性含义
@type	资源类型
@id	资源唯一标识URI
@language	默认语言
@vocab	默认词汇表

嵌套结构

人物与组织

JSON

{
  "@context": "https://schema.org",
  "@type": "Person",
  "name": "张三",
  "worksFor": {
    "@type": "Organization",
    "name": "科技公司",
    "url": "https://techcompany.com"
  },
  "address": {
    "@type": "PostalAddress",
    "addressLocality": "北京",
    "addressCountry": "CN"
  }
}

文章结构

JSON

{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "语义化HTML完全指南",
  "author": {
    "@type": "Person",
    "name": "小智"
  },
  "publisher": {
    "@type": "Organization",
    "name": "前端教程网",
    "logo": {
      "@type": "ImageObject",
      "url": "https://frontend.com/logo.png"
    }
  },
  "datePublished": "2026-05-17",
  "dateModified": "2026-05-17",
  "image": "https://frontend.com/article.jpg"
}

多类型声明

单资源多类型

JSON

{
  "@context": "https://schema.org",
  "@type": ["LocalBusiness", "Restaurant"],
  "name": "美食餐厅",
  "address": {...},
  "servesCuisine": "中式"
}

多实体定义

使用 @graph

JSON

{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@type": "Person",
      "@id": "#作者1",
      "name": "张三"
    },
    {
      "@type": "Article",
      "@id": "#文章1",
      "author": {"@id": "#作者1"},
      "headline": "文章标题"
    }
  ]
}

数据类型处理

时间日期

JSON

{
  "@context": "https://schema.org",
  "@type": "Event",
  "name": "技术大会",
  "startDate": "2026-05-20T09:00:00+08:00",
  "endDate": "2026-05-20T18:00:00+08:00"
}

数值与货币

JSON

{
  "@context": "https://schema.org",
  "@type": "Offer",
  "price": "5999.00",
  "priceCurrency": "CNY"
}

URL 与链接

JSON

{
  "@context": "https://schema.org",
  "@type": "WebPage",
  "url": "https://example.com/page",
  "mainEntity": {
    "@id": "https://example.com/article#main"
  }
}

JSON-LD 优势

优势	说明
分离	与HTML分离，不影响页面结构
易维护	JSON格式，便于生成和修改
可扩展	支持多词汇表、多类型
工具支持	搜索引擎首选格式

放置位置

HTML

<!DOCTYPE html>
<html>
<head>
  <title>文章标题</title>

  <!-- 推荐放在head内 -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "Article",
    ...
  }
  </script>
</head>
<body>
  <!-- 页面内容 -->

  <!-- 或放在body末尾 -->
  <script type="application/ld+json">
  {...}
  </script>
</body>
</html>

验证工具

Google Rich Results Test
Schema.org Validator
JSON-LD Playground

注意：JSON-LD 内容必须与页面可见内容一致，搜索引擎会验证一致性。

要点总结

@context 指定 Schema.org 词汇表
@type 定义资源类型
嵌套对象表达复杂关系
与 HTML 分离，推荐放在 <head> 内
搜索引擎首选格式，SEO优化推荐使用

📝 发现内容有误？点击此处直接编辑