comparison-table-generator
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseComponents: Comparison Table Section
组件:对比表格板块
Guides comparison tables as an in-page section: a scannable matrix (rows × columns) embedded inside landing pages, blog posts, pricing pages, homepages, or docs. Not a standalone page type—parent page structure, URLs, and "alternatives vs blog" decisions come from alternatives-page-generator, landing-page-generator, article-page-generator, pricing-page-generator, etc. Distinct from FAQ (Q&A → FAQPage) and from HowTo (procedure → HowTo). schema-markup remains the source for exhaustive Schema.org rules; this skill owns section-level criteria, copy, HTML/accessibility, fairness, and ad alignment.
When invoking: On first use, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On subsequent use or when the user asks to skip, go directly to the main output.
本技能指导作为页面内板块的对比表格:一种可快速浏览的矩阵(行×列),嵌入在着陆页、博客文章、定价页、首页或文档内部。并非独立页面类型——父页面的结构、URL以及“替代方案vs博客”的决策由alternatives-page-generator、landing-page-generator、article-page-generator、pricing-page-generator等技能负责。与FAQ(问答→FAQPage)和HowTo(流程→HowTo)明确区分。schema-markup仍是Schema.org详尽规则的来源;本技能负责板块级的标准、文案、HTML/无障碍性、公平性及广告对齐。
调用时机:首次使用时,如有必要,先用1-2句话说明本技能的覆盖范围及重要性,再提供主要输出。后续使用或用户要求跳过说明时,直接输出核心内容。
Comparison Table Section vs Alternatives Page
对比表格板块 vs 替代方案页面
| Dimension | Comparison table section (this skill) | Alternatives / compare page |
|---|---|---|
| Scope | One block: headings, table, footnotes, optional CTA line | Full page or article: headline, intro, verdict, listicles, FAQ, metadata |
| URL / intent | Chosen by parent; section supports commercial or informational parent | Owns "X alternatives", "X vs Y", PPC landing strategy |
| PPC | Align copy and criteria with ad and parent LP | Owns where paid traffic lands (dedicated LP vs blog) |
| Skill | comparison-table-generator (this) | alternatives-page-generator |
Use both when building an alternatives LP: alternatives-page-generator for page structure; comparison-table-generator for the table itself (criteria, rows, cells, fairness).
| 维度 | 对比表格板块(本技能) | 替代方案/对比页面 |
|---|---|---|
| 范围 | 单个区块:标题、表格、脚注、可选CTA行 | 完整页面或文章:标题、引言、结论、列表、FAQ、元数据 |
| URL / 意图 | 由父页面决定;板块为商业性或信息性父页面提供支持 | 负责**“X的替代方案”、“X vs Y”**这类场景,以及PPC着陆策略 |
| PPC | 使文案和标准与广告及父着陆页对齐 | 负责付费流量的着陆位置(专用着陆页vs博客) |
| 对应技能 | comparison-table-generator(本技能) | alternatives-page-generator |
构建替代方案着陆页时可同时使用两者:alternatives-page-generator负责页面结构;comparison-table-generator负责表格本身(标准、行、单元格、公平性)。
Comparison Types (Same Component, Different Framing)
对比类型(组件相同,框架不同)
| Type | Rows / columns | Typical use |
|---|---|---|
| Product vs product | You vs 1–N competitors or tools | Alternatives LP, category pages, blog "best X" |
| Traditional vs modern | Old workflow vs your approach | Category creation, thought leadership, LP objection handling |
| Manual vs automated | Spreadsheets, agencies, DIY vs product | Mid-funnel LP, demo request pages |
| Before / after | State A vs State B (metrics allowed if true) | Outcome-focused LP, case studies |
| Feature / capability matrix | Features as rows; plans or products as columns | Pricing-adjacent, features-page-generator context |
Column count: Prefer 4–7 columns including names; more columns hurt mobile—use priority columns above the fold and expand or link to full spec.
| 类型 | 行/列设置 | 典型用途 |
|---|---|---|
| 产品vs产品 | 你的产品vs1-N个竞品或工具 | 替代方案着陆页、分类页、博客“最佳X”文章 |
| 传统vs现代 | 旧工作流vs你的方案 | 品类创建、思想领导力内容、着陆页异议处理 |
| 手动vs自动化 | 电子表格、代理机构、自助方式vs产品 | 中漏斗着陆页、演示请求页 |
| 前后对比 | 状态Avs状态B(若真实可包含指标) | 结果导向型着陆页、案例研究 |
| 功能/能力矩阵 | 功能为行;套餐或产品为列 | 定价相关页面、features-page-generator场景下的内容 |
列数:建议包含名称在内共4-7列;列数过多会影响移动端体验——可将核心列放在首屏,其余列通过展开或链接查看完整规格。
Placement Within the Parent Page
在父页面中的位置
| Location | When |
|---|---|
| After hero + short value prop | LP: remove doubt early; before long prose |
| After "problem" / "why switch" | Alternatives or comparison article: user is ready for criteria |
| Before FAQ | Table answers "which is better for X?"; FAQ handles objections |
| Mid-article | Blog: after context; supports featured-snippet table patterns |
Narrative: Table should answer the promise of the H1/H2—do not bury the matrix below unrelated storytelling.
| 位置 | 适用场景 |
|---|---|
| Hero区+简短价值主张之后 | 着陆页:尽早消除疑虑;放在长篇文案之前 |
| “问题”/“为何切换”板块之后 | 替代方案或对比文章:用户已准备好查看对比标准 |
| FAQ之前 | 表格回答“哪款更适合X?”;FAQ处理异议 |
| 文章中部 | 博客:提供背景信息之后;支持featured-snippet表格模式 |
叙事逻辑:表格应呼应H1/H2的核心承诺——不要将矩阵埋在无关的叙事内容之下。
Content Structure
内容结构
Section title (H2)
板块标题(H2)
- Default: Outcome or task-oriented—"How [Product] compares to [Competitor]," "[Category] comparison at a glance," "Traditional vs [Your approach]."
- Avoid: Vague "Comparison" alone; match query language where relevant ("vs", alternatives, best for).
- 默认风格:以结果或任务为导向——“[产品]与[竞品]对比”、“[品类]概览对比”、“传统方式vs[你的方案]”。
- 避免:仅用模糊的“对比”;相关情况下匹配搜索词(如**“vs”**、替代方案、最适合)。
Intro (1–3 sentences)
引言(1-3句话)
- State who the table is for and criteria (e.g. "pricing as of [date]," "SMB-focused").
- Transparency: "We sell [Product]; we include [Competitor] because users search for both."
- 说明表格的目标受众和对比标准(例如:“定价截至[日期]”、“面向SMB”)。
- 透明度:“我们销售[产品];纳入[竞品]是因为用户会同时搜索两者。”
The table
表格
- HTML with
<table>,<thead>scope,<th>(summary for screen readers).<caption> - Cells: Short phrases, icons, or Yes/No/Limited—avoid marketing fluff in cells; footnote nuance.
- Parity: Compare on dimensions competitors would accept; cherry-picked rows erode trust and GEO citation.
- Last updated: Row or footnote—pricing and limits must be refreshable.
- 使用带、
<thead>范围、<th>(供屏幕阅读器读取的摘要)的HTML<caption>。<table> - 单元格:简短短语、图标或是/否/有限支持——避免在单元格中使用营销话术;细节放在脚注中。
- 对等性:选择竞品也认可的维度进行对比;刻意挑选有利维度会损害信任,影响GEO引用。
- 更新时间:在行或脚注中标注——定价和限制条件必须可更新。
Below the table
表格下方
- Optional: One "Best for" line per column (if not already in table).
- CTA: Single primary CTA aligned with parent page (trial, demo, contact)—not one CTA per competitor cell unless design system allows.
- 可选:每列对应一句“最适合人群”(若未在表格中体现)。
- CTA:单个与父页面对齐的主CTA(试用、演示、联系)——除非设计系统允许,否则不要为每个竞品单元格设置单独CTA。
SEO
SEO
- Intent: Often commercial; align headings and intro with "vs", alternatives, best [category] modifiers.
- Snippets: Semantic table + clear headers support list/table extraction; see featured-snippet.
- Keywords: Work natural competitor names into caption, headings, or intro—avoid stuffing; alternatives-page-generator owns keyword strategy for full URLs.
- 意图:通常为商业意图;使标题和引言与**“vs”**、替代方案、**最佳[品类]**等修饰词对齐。
- 摘要:语义化表格+清晰表头支持列表/表格提取;参考featured-snippet。
- 关键词:将竞品名称自然融入caption、标题或引言——避免堆砌;alternatives-page-generator负责完整URL的关键词策略。
GEO (AI Search)
GEO(AI搜索)
- Extractable facts: Tables with plain text in cells are easier for models to cite than long paragraphs.
- Fairness: Acknowledge where a competitor is strong—overly biased matrices are less likely to be summarized neutrally in AI answers.
- Entity clarity: Use consistent product names (same spelling as in entity-seo / Organization).
- 可提取事实:单元格为纯文本的表格比长段落更易被模型引用。
- 公平性:承认竞品的优势——过于偏向自己的矩阵在AI回答中更难被中立总结。
- 实体清晰度:使用一致的产品名称(与entity-seo / Organization中的拼写一致)。
Paid Ads Alignment
付费广告对齐
- Message match: Table criteria and headline should reflect ad copy (e.g. "cheaper," "faster," "no code")—see paid-ads-strategy, landing-page-generator.
- Landing: Competitor brand campaigns → dedicated LP with comparison section; alternatives-page-generator + google-ads for policy.
- 信息匹配:表格的标准和标题应反映广告文案(如“更便宜”、“更快”、“无需代码”)——参考paid-ads-strategy、landing-page-generator。
- 着陆策略:竞品品牌广告→带对比板块的专用着陆页;alternatives-page-generator + google-ads负责合规性。
Accessibility & Mobile
无障碍性与移动端适配
- Never rely on images only for the matrix—use a real table; images can supplement.
- Responsive: Horizontal scroll with visible focus, or card layout per row on small screens (tab-accordion patterns only if content stays in DOM).
- Color: Don't encode meaning by color alone (WCAG contrast).
- 切勿仅依赖图片展示矩阵——使用真实表格;图片可作为补充。
- 响应式设计:小屏幕上可采用横向滚动(带可见焦点)或每行对应一个卡片的布局(仅当内容保留在DOM中时,可使用tab-accordion模式)。
- 颜色:不要仅通过颜色传递信息(符合WCAG对比度要求)。
Fairness, Legal, Trademark
公平性、法律与商标
- Factual claims: Prices, limits, integrations—cite source or "as of [date]"; no invented specs.
- Trademark: Use competitor names accurately for comparison (nominative use); avoid confusing logos without permission—follow legal review.
- Tone: FUD and disparagement hurt trust and SEO; objective tables win.
- 事实声明:价格、限制条件、集成功能——标注来源或“截至[日期]”;不要编造规格。
- 商标:准确使用竞品名称进行对比(合理使用);未经许可不要使用易混淆的logo——遵循法律审核要求。
- 语气:FUD(恐惧、不确定、怀疑)和贬低性内容会损害信任和SEO;客观的表格更有效。
Schema (High Level)
Schema(概述)
- FAQ below the table → FAQPage if Q&A pairs; see faq-page-generator.
- Product / Offer on product pages—see schema-markup; this skill does not duplicate schema tables.
- No fake HowTo for comparison tables.
- 表格下方的FAQ→若为问答配对则使用FAQPage;参考faq-page-generator。
- 产品页面上的Product / Offer——参考schema-markup;本技能不重复schema表格内容。
- 不要为对比表格伪造HowTo类型。
Anti-Patterns
反模式
- Screenshot-only comparison (no crawlable text).
- Hidden columns that only favor you (users and reviewers notice).
- Stale pricing—add refresh owner or date in content workflow.
- 仅截图的对比(无可抓取文本)。
- 隐藏仅对自己有利的列(用户和审核者会注意到)。
- 过时定价——在内容工作流中添加更新负责人或日期标注。
Best Practices Checklist
最佳实践检查清单
- with
<table>, header cells, semantic structure<caption> - Criteria fair and parity across columns
- Intro states bias (you are the vendor) and evaluation frame
- Last updated or as-of for volatile fields
- Mobile usable (scroll or card fallback)
- PPC / H1 alignment if traffic is paid
- Paired FAQ or short copy for objections if parent page needs it
- 带、表头单元格、语义化结构的**
<caption>**<table> - 各列的对比标准公平且对等
- 引言说明立场(你是供应商)和评估框架
- 易变字段标注更新时间或“截至日期”
- 移动端可用(滚动或卡片 fallback)
- 若为付费流量,与PPC / H1对齐
- 若父页面需要,搭配FAQ或简短文案处理异议
Output Format
输出格式
- Placement of the section within the parent page
- Comparison type (product vs product, traditional vs modern, etc.)
- Column/row design (criteria list; row labels)
- Draft table (HTML outline or Markdown grid with cell guidance)
- Footnotes for nuanced cells
- Fairness notes (what to acknowledge about competitors)
- Ad alignment notes (if PPC)
- Explicit: Section block only—defer full page wireframe to alternatives-page-generator / landing-page-generator / article-page-generator
- 板块在父页面中的位置
- 对比类型(产品vs产品、传统vs现代等)
- 列/行设计(标准列表;行标签)
- 草稿表格(HTML大纲或带单元格指导的Markdown网格)
- 针对复杂单元格的脚注
- 公平性说明(需承认的竞品优势)
- 广告对齐说明(若涉及PPC)
- 明确说明:仅输出板块内容——全页面线框请交给alternatives-page-generator / landing-page-generator / article-page-generator处理
Related Skills
相关技能
- alternatives-page-generator: Full alternatives/compare page or blog; keywords, PPC destination, URL strategy
- landing-page-generator: LP structure; when comparison sits on a paid LP
- article-page-generator: Blog posts with comparison section
- pricing-page-generator: Pricing grids and comparisons; features-page-generator for feature matrix context
- faq-page-generator: FAQ below or beside comparison table
- featured-snippet: Table/list snippet patterns
- schema-markup: Product, FAQPage, Article—full JSON-LD rules
- entity-seo: Entity naming and consistency for GEO
- paid-ads-strategy, google-ads: Competitor brand ads, message match
- competitor-research: Research inputs; not end-user copy
- tab-accordion: Optional mobile patterns; DOM visibility
- content-optimization: Headings and keyword placement in longform
- alternatives-page-generator:完整的替代方案/对比页面或博客;关键词、PPC落地、URL策略
- landing-page-generator:着陆页结构;对比板块在付费着陆页中的应用场景
- article-page-generator:包含对比板块的博客文章
- pricing-page-generator:定价网格与对比;features-page-generator负责功能矩阵场景
- faq-page-generator:对比表格下方或旁边的FAQ
- featured-snippet:表格/列表摘要模式
- schema-markup:Product、FAQPage、Article——完整JSON-LD规则
- entity-seo:GEO场景下的实体命名与一致性
- paid-ads-strategy、google-ads:竞品品牌广告、信息匹配
- competitor-research:研究输入;不生成面向终端用户的文案
- tab-accordion:可选移动端模式;DOM可见性
- content-optimization:长文内容中的标题与关键词布局
References
参考资料
- Comparison Page SEO: How to Rank for "X vs Y" Queries (Vydera)—table centrality, snippet/AI citation
- Effective Comparison Pages: Steps for Better Conversion (Semrush)—conversion, structure
- Competitor comparison landing pages (Wordtune)—tone, fairness
- Understanding 1.3.1 Info and Relationships (WCAG)—tables and semantics
- Comparison Page SEO: How to Rank for "X vs Y" Queries(Vydera)——表格核心地位、摘要/AI引用
- Effective Comparison Pages: Steps for Better Conversion(Semrush)——转化、结构
- Competitor comparison landing pages(Wordtune)——语气、公平性
- Understanding 1.3.1 Info and Relationships(WCAG)——表格与语义化