comparison-table-generator

# Components: 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.

## Comparison Table Section vs Alternatives Page

| 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).

## 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.

## 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.

## Content Structure

### Section title (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**).

### Intro (1–3 sentences)

- 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."

### The table

- **HTML `<table>`** with `<thead>`, `<th>` scope, **`<caption>`** (summary for screen readers).
- **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.

### 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.

## 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.

## GEO (AI Search)

- **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**).

## 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.

## 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 mean