---
title: 给博客加上结构化数据：JSON-LD 完整实践
url: https://vabora.dev/posts/jsonld-structured-data-blog
author: Vabora
published: 2026-09-06 08:05:53
updated: 2026-09-26 20:02:28
category: 技术分享
tags: SEO, GEO, Vue 3
canonical: https://vabora.dev/posts/jsonld-structured-data-blog
license: 转载与引用请注明出处并保留原文链接
---

# 给博客加上结构化数据：JSON-LD 完整实践

> 结构化数据是把「网页」翻译成「数据」的桥梁。搜索引擎与 AI 都靠它理解页面到底在讲什么。 博客必备的四类 WebSite：站点名称 + 站内搜索入口 BlogPosting：标题、作者、发布时间、正文时长 BreadcrumbList：层级路径 Person：作者身份与社交账号…
结构化数据是把「网页」翻译成「数据」的桥梁。搜索引擎与 AI 都靠它理解页面到底在讲什么。

## 博客必备的四类

- `WebSite`：站点名称 + 站内搜索入口
- `BlogPosting`：标题、作者、发布时间、正文时长
- `BreadcrumbList`：层级路径
- `Person`：作者身份与社交账号

## 输出方式

```php
$json = json_encode($schema, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES);
return '<script type="application/ld+json">' . $json . '</script>';
```

> 注意：JSON-LD 会被当作纯数据块，不执行脚本，因此不会被 CSP 拦截。

## 面包屑示例

```json
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    { "@type": "ListItem", "position": 1, "name": "首页", "item": "https://vabora.dev/" },
    { "@type": "ListItem", "position": 2, "name": "文章", "item": "https://vabora.dev/posts/php85-zero-dependency-framework" }
  ]
}
```

## 校验清单

1. 用 Google 富媒体测试工具验证语法
2. `datePublished` 必须是 ISO-8601
3. `headline` 控制在 110 字符内
4. 图片地址必须是绝对 URL

## 小结

结构化数据投入小、收益稳定，是 SEO 与 GEO 的**共同底座**。