mcpField
W
web-content

web-content

github.com/alinaqi营销与增长711325 次安装2 周前更新
代码仓库

关于 web-content

web-content 是面向内容创作者和营销团队的技能,用于编写兼顾传统 SEO 与 AI 搜索发现的网页内容。它提供页面模板、内容格式、结构化数据和流量追踪建议。

主要功能

  1. 01提供首页、产品页、文章和 FAQ 模板
  2. 02组织 TL;DR、定义、比较表和分步指南
  3. 03建议按页面类型添加 Schema 标记
  4. 04针对 ChatGPT、Perplexity、Claude 和 Gemini 提供优化建议
  5. 05提供内容时效、作者可信度和发布检查清单
  6. 06给出 AI 来源流量的追踪方法

适用场景

  1. 01撰写面向搜索和 AI 引用的文章
  2. 02为产品页或 FAQ 规划内容结构
  3. 03为网页选择并验证 Schema 标记
  4. 04在 GA4 中识别 AI 来源访问

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/alinaqi/maggy --skill web-content

安装后在 Claude Code 中输入/web-content确认已加载。

详细介绍

Web Content Skill

创建同时针对传统 SEO 和 AI 发现(ChatGPT、Perplexity、Claude、Gemini)优化的 Web 内容。

来源: GEO Complete Guide | AI Search SEO | LLM Optimization | Generative Engine Optimization


理念

SEO 带来点击。GEO 带来引用。

传统 SEO 针对 Google 排名进行优化。生成式引擎优化(GEO)则针对被 AI 助手引用进行优化。现代内容需要兼顾两者:

  • SEO:在搜索结果页面上获得排名
  • GEO:被引用到 AI 生成的答案中(ChatGPT、Perplexity、Claude、Gemini)

AI 流量在 2024 年 7 月至 2025 年 2 月间增长了 1,200%。Google 的搜索份额十年来首次跌破 90%。两者都要优化。


面向 AI + SEO 的内容结构

黄金法则

为人而写,为机器而组织。

AI 系统偏好:

  • 简短、清晰、基于事实的内容
  • 整洁的格式(标题、项目符号、表格)
  • 可单独引用的独立章节
  • 对问题的直接回答

页面类型与模板

首页
## Homepage Structure

### Above the Fold
- **Headline**: Clear value proposition (what you do + for whom)
- **Subheadline**: How you deliver that value
- **Primary CTA**: One clear action
- **Trust signals**: Logos, testimonials, stats

### Content Sections
1. **Problem Statement**: Pain point you solve
2. **Solution Overview**: How you solve it (3-4 key features)
3. **Social Proof**: Testimonials, case studies, logos
4. **How It Works**: 3-step process (simple)
5. **Pricing Preview**: Or link to pricing page
6. **FAQ Section**: 5-7 common questions (GEO gold)
7. **Final CTA**: Repeat primary action

### Schema Required
- Organization schema (name, logo, founding date, social links)
- WebSite schema with SearchAction
- FAQ schema for questions section
产品/服务页面
## Product Page Structure

### Hero Section
- **Product Name**: Clear, descriptive
- **One-line Description**: What it does in 10 words or less
- **Key Benefit**: Primary value proposition
- **CTA**: Buy/Try/Demo

### Content Sections
1. **TL;DR Box**: 3-5 bullet summary (AI-quotable)
2. **Problem → Solution**: What problem, how solved
3. **Features Grid**: 4-6 features with icons
4. **Comparison Table**: vs. alternatives (GEO loves these)
5. **Use Cases**: Who uses it and how
6. **Testimonials**: Real names, photos, companies
7. **Pricing**: Clear tiers if applicable
8. **FAQ**: Product-specific questions

### Schema Required
- Product schema (name, description, price, availability)
- Review schema (aggregate rating)
- FAQ schema
- BreadcrumbList schema
博客文章/文章
## Blog Post Structure

### Opening (First 100 words)
- **TL;DR**: Direct answer to the title's question
- **What you'll learn**: Bullet list of takeaways
- This section should be quotable standalone

### Body Structure
- **H2 sections**: Main topics (5-7 per article)
- **H3 subsections**: Supporting points
- **Bullet lists**: For scanability
- **Stat boxes**: Highlight key numbers
- **Comparison tables**: When comparing options

### Content Elements
- Definition boxes ("What is X?")
- Step-by-step instructions
- Code examples (if technical)
- Original statistics/research
- Expert quotes with attribution

### Closing
- **Summary**: Key takeaways (bulleted)
- **Next steps**: What reader should do
- **Related content**: Internal links

### Metadata Required
- Author name + bio + photo
- Publication date
- Last updated date (visible!)
- Reading time
- Article schema with author
常见问题页面
## FAQ Page Structure

### Organization
- Group questions by category
- Most common questions first
- Direct, concise answers
- Link to detailed pages for more info

### Question Format
Q: [Exact question users ask]
A: [Direct answer in first sentence, then elaboration]

### Schema Required
- FAQPage schema (critical for AI discovery)
- Each Q&A as Question/Answer schema
落地页
## Landing Page Structure

### Single Focus
- One offer
- One audience
- One CTA (repeated)

### Sections
1. **Headline**: Benefit-focused, specific
2. **Problem Agitation**: Pain points
3. **Solution**: Your offer
4. **Proof**: Testimonials, stats, logos
5. **Features**: 3-5 key benefits
6. **Objection Handling**: FAQ or guarantee
7. **CTA**: Clear, urgent

### No Navigation
- Remove header nav (reduce exits)
- Single path: read → convert

面向 AI 优化的内容格式

TL;DR 摘要框
<div class="tldr-box">
  <h3>TL;DR</h3>
  <ul>
    <li>Key point 1 with specific detail</li>
    <li>Key point 2 with number/stat</li>
    <li>Key point 3 with actionable insight</li>
  </ul>
</div>

放在文章开头。AI 系统会提取这些内容用于生成摘要。

定义区块
## What is [Term]?

[Term] is [concise definition in one sentence]. It [what it does] by [how it works].

**Key characteristics:**
- Characteristic 1
- Characteristic 2
- Characteristic 3

以“X 是什么?”开头——AI 系统会寻找这种模式。

对比表格
| Feature | Product A | Product B | Our Product |
|---------|-----------|-----------|-------------|
| Price | $99/mo | $149/mo | $79/mo |
| Feature 1 | ✓ | ✗ | ✓ |
| Feature 2 | ✗ | ✓ | ✓ |
| Best For | Enterprise | Startups | SMBs |

AI 喜欢结构化的对比内容。在产品页面和评测页面中加入对比表格。

统计数据框
<div class="stat-box">
  <span class="stat-number">73%</span>
  <span class="stat-label">of users prefer AI search for complex queries</span>
  <span class="stat-source">Source: Adobe Analytics, 2024</span>
</div>

附带来源的原创统计数据会被 AI 引用。

分步指南
## How to [Do Thing]

### Step 1: [Action Verb] [Object]
[Explanation of what to do]

**Example:**
[Concrete example]

### Step 2: [Action Verb] [Object]
[Explanation]

### Step 3: [Action Verb] [Object]
[Explanation]

**Result:** [What user achieves]

为此类内容使用 HowTo schema 标记。


Schema 标记(对 AI 至关重要)

Organization Schema
{
  "@context": "https://schema.org",
  "@type": "Organization",
  "name": "Your Company",
  "url": "https://yoursite.com",
  "logo": "https://yoursite.com/logo.png",
  "foundingDate": "2020",
  "description": "One sentence description",
  "sameAs": [
    "https://twitter.com/yourcompany",
    "https://linkedin.com/company/yourcompany",
    "https://github.com/yourcompany"
  ],
  "contactPoint": {
    "@type": "ContactPoint",
    "email": "[email protected]",
    "contactType": "customer service"
  }
}
Article Schema
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Article Title",
  "description": "Meta description",
  "image": "https://yoursite.com/article-image.jpg",
  "author": {
    "@type": "Person",
    "name": "Author Name",
    "url": "https://yoursite.com/team/author-name",
    "jobTitle": "Role at Company",
    "sameAs": [
      "https://linkedin.com/in/author",
      "https://twitter.com/author"
    ]
  },
  "publisher": {
    "@type": "Organization",
    "name": "Your Company",
    "logo": {
      "@type": "ImageObject",
      "url": "https://yoursite.com/logo.png"
    }
  },
  "datePublished": "2025-01-15",
  "dateModified": "2025-01-20"
}
FAQ Schema
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "What is your product?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Direct answer here. Keep concise but complete."
      }
    },
    {
      "@type": "Question",
      "name": "How much does it cost?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Pricing starts at $X/month for basic plan..."
      }
    }
  ]
}
Product Schema
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Product Name",
  "description": "Product description",
  "image": "https://yoursite.com/product.jpg",
  "brand": {
    "@type": "Brand",
    "name": "Your Company"
  },
  "offers": {
    "@type": "Offer",
    "price": "29.99",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock"
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4.8",
    "reviewCount": "127"
  }
}
HowTo Schema
{
  "@context": "https://schema.org",
  "@type": "HowTo",
  "name": "How to Set Up Your Account",
  "description": "Step-by-step guide to getting started",
  "step": [
    {
      "@type": "HowToStep",
      "name": "Create account",
      "text": "Go to signup page and enter your email"
    },
    {
      "@type": "HowToStep",
      "name": "Verify email",
      "text": "Click the link in the verification email"
    }
  ]
}

针对特定平台的优化

ChatGPT 优化
✅ DO:
- TL;DR sections at top of articles
- Consistent formatting (headers, bullets)
- Named authors with credentials
- Original research and statistics
- Multi-intent content (covers related questions)

❌ AVOID:
- Thin content without substance
- Missing author attribution
- Outdated information (no dates)
Perplexity 优化
✅ DO:
- Original statistics with sources
- Comparison tables and structured data
- Clean URL slugs (/topic-name not /p=123)
- Short, declarative statements
- Images, charts, diagrams
- YouTube videos (Perplexity shows these)

❌ AVOID:
- Generic content without unique insights
- Missing citations/sources
- Poor URL structure
Claude 优化
✅ DO:
- Well-structured, logical content
- Clear definitions and explanations
- Technical accuracy
- Balanced perspectives
- Proper citations

❌ AVOID:
- Misleading or sensational content
- Missing context
- Outdated technical information
Gemini 优化
✅ DO:
- Rich schema markup
- Detailed image alt-text
- YouTube content (Google-owned)
- Multimedia (video, audio with transcripts)

❌ AVOID:
- Missing structured data
- Images without alt-text
- Text-only content

面向 AI 发现的 E-E-A-T

经验
  • 第一人称案例研究
  • “我们测试了 X,发现 Y”
  • 原创截图和数据
  • 包含真实细节的用户评价
专业性
  • 附有资质信息的作者简介
  • 链接到作者的其他作品
  • 行业专属术语
  • 与主题相匹配的技术深度
权威性
  • 来自可信来源的反向链接
  • 在行业出版物中被提及
  • 被其他专家引用
  • 社会认同(关注者、互动)
可信度
  • 清晰展示联系信息
  • 包含团队详情的关于页面
  • 隐私政策和条款
  • 安全的网站(HTTPS)
  • 准确且及时更新的信息

内容时效性

显示日期(必需)
<article>
  <header>
    <h1>Article Title</h1>
    <div class="meta">
      <span class="author">By John Smith</span>
      <span class="published">Published: January 15, 2025</span>
      <span class="updated">Last updated: January 20, 2025</span>
    </div>
  </header>
</article>

AI 系统偏好近期内容。醒目地显示日期。

更新计划
内容类型更新频率
产品页面功能变更时
定价变更后立即更新
博客文章每季度审核
统计数据有新数据时
指南每半年一次

AI 流量分析

GA4 正则表达式筛选器
.*chatgpt\.com.*|.*perplexity\.ai.*|.*gemini\.google\.com.*|.*copilot\.microsoft\.com.*|.*openai\.com.*|.*claude\.ai.*|.*poe\.com.*|.*you\.com.*|.*phind\.com.*
跟踪 AI 引荐流量
// Check for AI referrer
const aiReferrers = [
  'chatgpt.com',
  'chat.openai.com',
  'perplexity.ai',
  'claude.ai',
  'gemini.google.com',
  'copilot.microsoft.com',
  'poe.com',
  'you.com',
  'phind.com'
];

const referrer = document.referrer;
const isAIReferral = aiReferrers.some(ai => referrer.includes(ai));

if (isAIReferral) {
  analytics.track('ai_referral', {
    source: referrer,
    page: window.location.pathname
  });
}
调查 AI 发现来源

添加到表单中:

How did you hear about us?
- [ ] Google Search
- [ ] ChatGPT
- [ ] Perplexity
- [ ] Claude
- [ ] Social Media
- [ ] Referral
- [ ] Other

内容检查清单

发布前
## SEO Checklist
- [ ] Title tag (50-60 chars) with primary keyword
- [ ] Meta description (150-160 chars) with CTA
- [ ] URL slug is clean and descriptive
- [ ] H1 matches title intent
- [ ] H2/H3 hierarchy is logical
- [ ] Images have descriptive alt-text
- [ ] Internal links to related content
- [ ] External links to authoritative sources

## GEO Checklist
- [ ] TL;DR or summary at top
- [ ] Direct answer to main question in first paragraph
- [ ] Stat boxes with sources
- [ ] Comparison tables where applicable
- [ ] FAQ section with schema
- [ ] Author name, bio, and credentials
- [ ] Publication and last-updated dates visible
- [ ] Schema markup validated
- [ ] Content can be quoted standalone
- [ ] Original insights or data included
Schema 验证
# Validate schema markup
# Use: https://validator.schema.org/
# Or: https://search.google.com/test/rich-results

项目结构

project/
├── content/
│   ├── pages/
│   │   ├── home.md
│   │   ├── about.md
│   │   ├── pricing.md
│   │   └── contact.md
│   ├── blog/
│   │   ├── post-1.md
│   │   └── post-2.md
│   └── legal/
│       ├── privacy.md
│       └── terms.md
├── components/
│   ├── SchemaMarkup.tsx
│   ├── TLDRBox.tsx
│   ├── StatBox.tsx
│   ├── FAQSection.tsx
│   └── AuthorBio.tsx
└── lib/
    └── schema.ts           # Schema generators

反模式

  • 不标注日期 - AI 会降低未标注日期内容的优先级
  • 匿名内容 - 没有作者 = 没有 E-E-A-T
  • 大段文字 - 使用标题、项目符号和文本框拆分内容
  • 内容泛泛 - 添加原创见解、数据和观点
  • 缺少 Schema - 结构化数据爬虫无法发现内容
  • 信息过时 - 至少每季度更新一次
  • 没有 FAQ - 错失轻松提升 GEO 的机会
  • URL 结构不佳 - 使用 /topic-name,而不是 /p=12345

快速参考

AI 喜爱的内容格式
  1. TL;DR 摘要
  2. 定义框(“什么是 X?”)
  3. 对比表格
  4. 分步指南
  5. FAQ 部分
  6. 标注来源的数据框
  7. 带数字的列表文章
不同页面类型所需的 Schema
页面类型Schema
首页Organization、WebSite
博客文章Article、Author、FAQ
产品页Product、Review、FAQ
FAQFAQPage
操作指南HowTo
关于页面Organization、Person

评论

支持 Markdown