4.2 KiB
4.2 KiB
SEO 检查示例
本示例展示如何使用 /seo-check 命令快速检查网站 SEO 基础要素。
场景
你刚刚完成了一个 Next.js 项目的开发，想要快速检查 SEO 基础设置是否完善。
步骤 1: 运行 SEO 检查
/seo-check
步骤 2: 查看输出
✅ SEO 快速检查完成
📊 扫描统计
├─ 扫描页面: 15 个
├─ 路由系统: Next.js App Router
├─ 检测语言: 中文 (zh-CN)
⚠️ 发现的问题
🔴 高优先级（P0）
├─ 3 个页面缺少 Description
│ └─ app/page.tsx
│ └─ app/about/page.tsx
│ └─ app/contact/page.tsx
├─ 5 个页面标题过短
│ └─ app/blog/page.tsx - "Blog" (仅 4 字符)
│ └─ ...
└─ 8 个页面缺少 OG 标签
🟡 中优先级（P1）
├─ 10 个页面标题缺少关键词
├─ 6 个页面缺少结构化数据
└─ 2 个图片缺少 alt 文本
🟢 低优先级（P2）
├─ 4 个页面可以改进内链
└─ 建议添加社交分享按钮
✅ 做得好的地方
├─ 所有页面都有 Title 标签
├─ URL 结构清晰
└─ 使用了 HTTPS
步骤 3: 修复高优先级问题
问题 1: 缺少 Description
为 app/page.tsx 添加 Description：
/metadata app/page.tsx
生成结果：
export const metadata = {
title: 'Claude Code SEO - Next.js SEO 优化助手',
description: '强大的 Claude Code SEO 插件，为 Next.js 项目提供全面的 SEO 优化支持。自动审计、元数据生成、结构化数据。', // ✅ 已添加
...
}
问题 2: 标题过短
修改 app/blog/page.tsx 的标题：
// ❌ 之前
export const metadata = {
title: 'Blog' // 4 字符，过短
}
// ✅ 之后
export const metadata = {
title: 'SEO 优化博客 - Next.js SEO 最佳实践与技巧' // 24 字符，合适
}
问题 3: 缺少 OG 标签
添加 Open Graph 标签：
export const metadata = {
title: '...',
description: '...',
openGraph: {
title: 'Claude Code SEO - Next.js SEO 优化助手',
description: '强大的 Claude Code SEO 插件，为 Next.js 项目提供全面的 SEO 优化支持',
url: 'https://yourdomain.com',
siteName: 'Claude Code SEO',
images: [{
url: 'https://yourdomain.com/og-image.jpg',
width: 1200,
height: 630,
}],
locale: 'zh_CN',
type: 'website',
},
}
步骤 4: 再次检查
/seo-check
新的输出：
✅ SEO 快速检查完成
📊 扫描统计
├─ 扫描页面: 15 个
├─ 路由系统: Next.js App Router
├─ 检测语言: 中文 (zh-CN)
⚠️ 发现的问题
🟡 中优先级（P1）
├─ 7 个页面标题可以优化
├─ 6 个页面缺少结构化数据 ← 下一步
└─ 2 个图片缺少 alt 文本
🟢 低优先级（P2）
├─ 4 个页面可以改进内链
└─ 建议添加社交分享按钮
✅ 改进成果
├─ ✅ 所有页面都有 Description
├─ ✅ 标题长度已优化
└─ ✅ 添加了 OG 标签
步骤 5: 继续优化
添加结构化数据
/structured-data app/page.tsx Organization
生成结果：
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "Claude Code SEO",
"url": "https://yourdomain.com",
"logo": "https://yourdomain.com/logo.png",
"description": "强大的 Claude Code SEO 插件"
}
</script>
💡 关键要点
- 快速检查 -
/seo-check提供即时的 SEO 健康检查 - 优先级明确 - 问题按优先级分类，知道先修复什么
- 具体建议 - 每个问题都有具体的文件位置和修复建议
- 持续改进 - 修复后再次检查，验证改进效果
🎯 下一步
相关命令：
/seo-audit- 完整 SEO 审计/metadata- 生成元数据/structured-data- 生成结构化数据
需要更多示例？