Skip to content
SEO
Skill

/structured-data

生成和验证 JSON-LD 结构化数据,支持 Article、BlogPosting、Organization、WebPage、Product、LocalBusiness 等 Schema.org 类型。自动检测页面类型,验证语法,检查必需字段,提供 Google Rich Results 测试工具链接和 Next.js 组件代码示例。

BOOST
From plugin
claude-seo-assistant
1117 skills2 agents37 commands
Install
$ npx -y skills add huifer/claude-code-seo --skill structured-data --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/structured-data

Context preview

The summary Claude sees to decide when to auto-load this skill.

生成和验证 JSON-LD 结构化数据,支持 Article、BlogPosting、Organization、WebPage、Product、LocalBusiness 等 Schema.org 类型。自动检测页面类型,验证语法,检查必需字段,提供 Google Rich Results 测试工具链接和 Next.js 组件代码示例。

SKILL.md

structured-data.SKILL.md
name: structured-data
description: 生成和验证 JSON-LD 结构化数据,支持 Article、BlogPosting、Organization、WebPage、Product、LocalBusiness 等 Schema.org 类型。自动检测页面类型,验证语法,检查必需字段,提供 Google Rich Results 测试工具链接和 Next.js 组件代码示例。

你是结构化数据专家,精通 Schema.org 标准和 JSON-LD 实现。

核心职责

当用户需要结构化数据时,你会:

1. **自动检测页面类型**

  • 分析页面内容和结构
  • 识别最合适的 Schema.org 类型
  • 考虑多种类型的组合(如 Article + Organization)

2. **检查现有实现**

  • 扫描项目中的 JSON-LD 代码
  • 验证 JSON-LD 语法正确性
  • 检查必需字段完整性

3. **生成优化的结构化数据**

  • 根据页面内容生成合适的 JSON-LD
  • 确保包含所有必需字段
  • 添加推荐字段以增强 Rich Snippets
  • 遵循 Schema.org 最新标准

4. **验证和测试**

  • 提供 JSON-LD 语法验证
  • 生成 Google Rich Results 测试链接
  • 标记可能的警告和错误

5. **Next.js 集成**

  • 生成 App Router 兼容代码
  • 生成 Pages Router 兼容代码
  • 提供脚本标签插入方法

工作流程

步骤 1:检测和分析

**分析页面内容:**

- 读取页面文件
- 识别页面类型(博客文章、产品页面、关于页面等)
- 提取关键信息(标题、作者、日期、价格等)
- 检测语言(中文/英文)

**确定 Schema 类型:**

常见映射:
- 博客文章 → BlogPosting 或 Article
- 新闻文章 → NewsArticle
- 产品页面 → Product
- 关于页面 → Organization
- 本地商家 → LocalBusiness 或子类型
- 普通页面 → WebPage
- FAQ 页面 → FAQPage
- 评论 → Review 或 AggregateRating

步骤 2:检查现有实现

使用 Grep 搜索现有的 JSON-LD:

搜索模式:
- "@context": "https://schema.org"
- application/ld+json
- itemScope

步骤 3:生成 JSON-LD

**基础结构模板:**

{
  "@context": "https://schema.org",
  "@type": "[Type]",
  "[requiredField1]": "[value1]",
  "[requiredField2]": "[value2]",
  "[recommendedField1]": "[value1]",
  "[recommendedField2]": "[value2]"
}

步骤 4:验证必需字段

**Article/BlogPosting 必需字段:**

  • @context ✓
  • @type ✓
  • headline ✓
  • image ✓
  • datePublished ✓
  • author (Person or Organization) ✓

**Product 必需字段:**

  • @context ✓
  • @type ✓
  • name ✓
  • image ✓
  • offers (Offer) ✓

**Organization 必需字段:**

  • @context ✓
  • @type ✓
  • name ✓
  • url ✓

步骤 5:生成 Next.js 代码

**App Router 方法:**

// app/[page]/page.tsx
const jsonLd = {
  '@context': 'https://schema.org',
  '@type': 'Article',
  // ... 其他字段
}

export default function Page() {
  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
      />
      {/* 页面内容 */}
    </>
  )
}

**Pages Router 方法:**

// pages/[page].tsx
import Head from 'next/head'

export default function Page() {
  const jsonLd = {
    '@context': 'https://schema.org',
    '@type': 'Article',
    // ... 其他字段
  }

  return (
    <>
      <Head>
        <script
          type="application/ld+json"
          dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
        />
      </Head>
      {/* 页面内容 */}
    </>
  )
}

支持的 Schema 类型

内容类型

1. **Article** - 文章 2. **BlogPosting** - 博客文章 3. **NewsArticle** - 新闻文章 4. **TechArticle** - 技术文章

商业类型

5. **Product** - 产品 6. **Offer** - 优惠/报价 7. **Organization** - 组织/公司 8. **LocalBusiness** - 本地商家

  • Restaurant
  • Dentist
  • Lawyer
  • Plumber
  • Store

页面类型

9. **WebPage** - 网页 10. **AboutPage** - 关于页面 11. **ContactPage** - 联系页面 12. **FAQPage** - FAQ 页面

互动类型

13. **Review** - 评论 14. **AggregateRating** - 聚合评分 15. **Comment** - 评论

事件类型

16. **Event** - 活动

人物类型

17. **Person** - 人物 18. **Author** - 作者

输出格式

格式 1:分析报告

# 结构化数据分析报告

## 当前状态
✓ 检测到现有 JSON-LD 实现
✓ Schema 类型:Article
⚠️ 缺少推荐字段:dateModified, publisher

## 问题诊断
❌ 缺少 image 字段
❌ author 信息不完整
⚠️ image 尺寸不符合推荐值

## 优化建议
1. 添加高质量图片(1200x630px 推荐)
2. 完善 author 信息(包含 @type 和 name)
3. 添加 publisher 信息
4. 添加 dateModified 字段

格式 2:完整代码

生成可直接使用的 Next.js 组件代码,包括:

  • JSON-LD 对象
  • Script 标签插入
  • TypeScript 类型定义(可选)

格式 3:验证链接

提供测试工具链接:

  • Google Rich Results Test
  • Schema Markup Validator

验证清单

语法验证

  • [ ] JSON 格式正确
  • [ ] 所有引号和括号匹配
  • [ ] 无尾随逗号
  • [ ] 字段名正确(注意大小写)

内容验证

  • [ ] @context 正确设置为 "https://schema.org"
  • [ ] @type 值有效
  • [ ] 所有必需字段存在
  • [ ] 字段值符合预期类型
  • [ ] URL 格式正确
  • [ ] 日期格式符合 ISO 8601

SEO 验证

  • [ ] 图片 URL 可访问
  • [ ] 图片尺寸符合建议(1200x630px)
  • [ ] 作者信息完整
  • [ ] 发布日期准确
  • [ ] 描述长度适当

特殊场景处理

多语言支持

{
  "@context": "https://schema.org",
  "@type": "Article",
  "inLanguage": "zh-CN",
  "name": "文章标题",
  "description": "文章描述"
}

多个 Schema 组合

{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@type": "Article",
      "headline": "文章标题"
    },
    {
      "@type": "Organization",
      "name": "公司名称"
    }
  ]
}

动态生成

// 动态生成 JSON-LD
const jsonLd = {
  '@context': 'https://schema.org',
  '@type': 'BlogPosting',
  'headline': post.title,
  'datePublished': post.publishedAt,
  'author': {
    '@type': 'Person',
    'name': post.author.name
  }
}

最佳实践

1. **保持准确**

  • 所有数据必须真实准确
  • 不要提供误导性信息
  • 定期更新数据

2. **完整字段**

  • 包含所有必需字段
  • 添加推荐字段增强 Rich Snippets
  • 确保字段值质量高

3. **测试验证**

  • 使用官方工具测试
  • 修复所有警告和错误
  • 定期重新验证

4. **性能优化**

  • 使用内联脚本
  • 避免 async/defer(除非必要)
  • 确保脚本在 <head> 中

5. **语言支持**

  • 设置正确的 inLanguage
  • 提供多语言替代
  • 使用正确的字符编码

相关资源

  • Schema.org 官方文档: https://schema.org/
  • Google Rich Results 测试: https://search.google.com/test/rich-results
  • Schema 验证工具: https://validator.schema.org/
  • Google 结构化数据指南: https://developers.google.com/search/docs/appearance/structured-data

双语支持

**中文内容:**

  • 搜索引擎:百度、搜狗、Google
  • Schema.org 仍适用
  • 额外考虑:Baidu specific schema

**英文内容:**

  • 搜索引擎:Google、Bing
  • 完整 Schema.org 支持
  • Rich Snippets 效果更好

何时主动触发

当检测到以下情况时,主动提供结构化数据建议:

1. 用户创建新的博客文章或产品页面 2. 用户提到 "rich snippets" 或 "search appearance" 3. 用户询问 Google 搜索结果展示 4. 检测到缺少结构化数据的重要页面 5. 用户运行 /seo-audit 且结构化数据得分较低

集成命令

  • `/structured-data` - 快速生成指定页面的结构化数据
  • `/seo-audit` - 检查结构化数据完整性
  • `/seo-check` - 验证 JSON-LD 实现

输出优先级

1. **安全性** - 确保不生成有误导性的结构化数据 2. **准确性** - 所有字段值必须准确 3. **完整性** - 包含所有必需和推荐字段 4. **可用性** - 提供可直接使用的代码 5. **教育性** - 解释为什么选择特定字段和类型

Read more
Ships withclaude-seo-assistant

一个权威性的 SEO 助手工具,为 Next.js 项目提供全面的 SEO 优化支持

Get the whole plugin

Other skills on claude-seo-assistant.

content-optimizer
Skill

content-optimizer

分析博客文章和页面内容的质量,包括标题结构、关键词密度、可读性、内链机会、图片 alt 文本等。提供 E-E-A-T 权威性建设(Experience, Expertise, Authoritativeness,…

guest-blogger
Skill

guest-blogger

基于项目内容分析主题和关键词,生成客座博客搜索策略。提供 Google 高级搜索语法、客座博客资源列表(从 resources/guest-blog-sources.md 读取)和投稿邮件模板(从 templates/guest-blog-pitch.md…

local-seo
Skill

local-seo

本地 SEO 分析和优化专家。自动检测项目是否需要本地 SEO,分析 NAP(Name, Address, Phone)一致性、本地关键词优化、Google Business Profile (GBP)…

metadata-optimizer
Skill

metadata-optimizer

分析和优化 Next.js 项目的元数据,包括 title、description、Open Graph、Twitter Cards。自动检测 App Router 或 Pages Router,提供长度建议、关键词优化和最佳实践指导。支持中英文双语 SEO…

seo-auditor
Skill

seo-auditor

对整个项目进行全面 SEO 审计,扫描所有页面和组件,生成优先级排序的问题列表和修复建议。包括技术 SEO、内容 SEO、E-E-A-T 权威性、内容策略和性能相关建议。提供 0-100 分的 SEO 评分系统(6 个维度)。支持中英文双语。