206 lines
4.2 KiB
Markdown
206 lines
4.2 KiB
Markdown
# SEO 检查示例
|
||
|
||
本示例展示如何使用 `/seo-check` 命令快速检查网站 SEO 基础要素。
|
||
|
||
---
|
||
|
||
## 场景
|
||
|
||
你刚刚完成了一个 Next.js 项目的开发，想要快速检查 SEO 基础设置是否完善。
|
||
|
||
---
|
||
|
||
## 步骤 1: 运行 SEO 检查
|
||
|
||
```bash
|
||
/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：
|
||
|
||
```bash
|
||
/metadata app/page.tsx
|
||
```
|
||
|
||
生成结果：
|
||
```typescript
|
||
export const metadata = {
|
||
title: 'Claude Code SEO - Next.js SEO 优化助手',
|
||
description: '强大的 Claude Code SEO 插件，为 Next.js 项目提供全面的 SEO 优化支持。自动审计、元数据生成、结构化数据。', // ✅ 已添加
|
||
...
|
||
}
|
||
```
|
||
|
||
### 问题 2: 标题过短
|
||
|
||
修改 `app/blog/page.tsx` 的标题：
|
||
|
||
```typescript
|
||
// ❌ 之前
|
||
export const metadata = {
|
||
title: 'Blog' // 4 字符，过短
|
||
}
|
||
|
||
// ✅ 之后
|
||
export const metadata = {
|
||
title: 'SEO 优化博客 - Next.js SEO 最佳实践与技巧' // 24 字符，合适
|
||
}
|
||
```
|
||
|
||
### 问题 3: 缺少 OG 标签
|
||
|
||
添加 Open Graph 标签：
|
||
|
||
```typescript
|
||
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: 再次检查
|
||
|
||
```bash
|
||
/seo-check
|
||
```
|
||
|
||
新的输出：
|
||
```
|
||
✅ SEO 快速检查完成
|
||
|
||
📊 扫描统计
|
||
├─ 扫描页面: 15 个
|
||
├─ 路由系统: Next.js App Router
|
||
├─ 检测语言: 中文 (zh-CN)
|
||
|
||
⚠️ 发现的问题
|
||
|
||
🟡 中优先级（P1）
|
||
├─ 7 个页面标题可以优化
|
||
├─ 6 个页面缺少结构化数据 ← 下一步
|
||
└─ 2 个图片缺少 alt 文本
|
||
|
||
🟢 低优先级（P2）
|
||
├─ 4 个页面可以改进内链
|
||
└─ 建议添加社交分享按钮
|
||
|
||
✅ 改进成果
|
||
├─ ✅ 所有页面都有 Description
|
||
├─ ✅ 标题长度已优化
|
||
└─ ✅ 添加了 OG 标签
|
||
```
|
||
|
||
---
|
||
|
||
## 步骤 5: 继续优化
|
||
|
||
### 添加结构化数据
|
||
|
||
```bash
|
||
/structured-data app/page.tsx Organization
|
||
```
|
||
|
||
生成结果：
|
||
```javascript
|
||
<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>
|
||
```
|
||
|
||
---
|
||
|
||
## 💡 关键要点
|
||
|
||
1. **快速检查** - `/seo-check` 提供即时的 SEO 健康检查
|
||
2. **优先级明确** - 问题按优先级分类，知道先修复什么
|
||
3. **具体建议** - 每个问题都有具体的文件位置和修复建议
|
||
4. **持续改进** - 修复后再次检查，验证改进效果
|
||
|
||
---
|
||
|
||
## 🎯 下一步
|
||
|
||
- 运行 `/seo-audit` 进行完整审计
|
||
- 查看 [评分系统](../scoring-system.md) 了解评分标准
|
||
- 阅读 [元数据优化指南](../guides/metadata-optimization.md)
|
||
|
||
---
|
||
|
||
**相关命令：**
|
||
- `/seo-audit` - 完整 SEO 审计
|
||
- `/metadata` - 生成元数据
|
||
- `/structured-data` - 生成结构化数据
|
||
|
||
---
|
||
|
||
**需要更多示例？**
|
||
- [E-E-A-T 审计示例](ee-audit.md)
|
||
- [本地 SEO 示例](local-seo.md)
|