Homepage Lab
Every row in src/config/homepage-concepts.ts renders as its own page below.
Baseline reproduces the approved A-v2 concept
(homepage-2026-advisor.astro) exactly. Every other config changes exactly
one axis vs baseline. The hypothesis is stated on each card.
- Baseline ★
Baseline: Advisor v2
The approved A-v2 direction, reproduced exactly: trust + use-case hero (no CTA in the hero), score-led ranked provider cards carrying every CTA, proof folded into the hero trust block, top10vpn indigo/purple accent.
- Hero
- trust · trust-usecase · indigo
- Cards
- ranked · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Proof-Led Hero
Tests: a proof-led hero (big 900+ tested / 188,000+ data-points stat callout, no use-case picker) vs the baseline trust-led hero. Same ranked, score-led cards below, same indigo accent.
- Hero
- trust · proof-led · indigo
- Cards
- ranked · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Speed-to-Answer Message
Tests: a 'speed-to-answer' hero headline (leans on the use-case picker as an instant-answer mechanic) vs the baseline's trust headline. Everything else, structure, cards, accent, stays identical to baseline.
- Hero
- speed-to-answer · trust-usecase · indigo
- Cards
- ranked · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Mint Accent
Tests: top10vpn's mint-forward accent (their secondary tint, pushed to the primary gradient) vs baseline's indigo/purple. Pure palette swap: same hero, same cards, same structure.
- Hero
- trust · trust-usecase · mint
- Cards
- ranked · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Brand-Blue Accent
Tests: VPN.com's own primary-blue design token as the accent vs the borrowed top10vpn indigo/purple gradient. Answers 'do we need someone else's palette, or does our own brand blue read just as trust-forward?'.
- Hero
- trust · trust-usecase · brand-blue
- Cards
- ranked · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Comparison Table Cards
Tests: a real comparison TABLE (rank/name/trust/price/CTA as columns, all 5 providers scannable in one glance) vs the baseline's stacked ranked cards. Same hero, same score-led emphasis on which stat leads.
- Hero
- trust · trust-usecase · indigo
- Cards
- comparison-table · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Grid Cards
Tests: a multi-column grid of provider cards (browse, not rank-order) vs the baseline's single-file vertically ranked list. Same hero, same cards content per provider.
- Hero
- trust · trust-usecase · indigo
- Cards
- grid · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Price-Led Cards
Tests: price-led card emphasis (the from-price is the dominant visual on each card) vs baseline's score-led emphasis (trust score/band dominant). Same ranked layout, same hero.
- Hero
- trust · trust-usecase · indigo
- Cards
- ranked · price-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker
- Variant
Standalone Proof Strip
Tests: pulling the 900+ tested / 188,000+ data-points proof OUT of the hero trust block and into its own strip directly above the cards, vs baseline folding it into the hero. Hero gets shorter; cards get a proof lead-in.
- Hero
- trust · trust-usecase · indigo
- Cards
- ranked · score-led
- Proof
- strip-above-cards
- Sections
- hero → cards → faq → broker
- Variant
Broker in the Hero
Tests: broker on the radar living in a split hero (trust+use-case left, domain-broker mini-CTA right) vs the baseline's quiet bottom band. The bottom broker band is dropped from `sections` since the hero now owns that CTA.
- Hero
- trust · split-broker · indigo
- Cards
- ranked · score-led
- Proof
- in-hero
- Sections
- hero → cards → press → faq
- Variant
Quiz Hero
HERO CONCEPT: one-tap use-case quiz → instant personalized rec + runner-up + optional objection capture; rankings always visible. Tests: replacing the trust headline + static picker with a single question ('What do you need a VPN for?') that resolves to a full recommendation card in place, no page nav, before any objection handling is offered. Cards below stay ranked/score-led and fully ungated, same as baseline.
- Hero
- speed-to-answer · quiz · indigo
- Cards
- ranked · score-led
- Proof
- in-hero
- Sections
- hero → cards → faq → broker