Three-Second Test: Auditing a Hero Section
Objective: Score a real hero section against the lesson's 4-component formula and the Ofspace failure patterns, to decide whether it would survive the 'three-second test' with a real visitor.
You're a CRO analyst reviewing Squarespace's own template hero sections before recommending which templates the design team should feature as 'conversion-ready' defaults.
Score the specimen hero against all 4 formula components and flag any of the 6 documented Ofspace failure patterns it exhibits.
Before you start
What you'll need
Free path (everything below is enough to finish)
Free, and turns a subjective 'this looks off' review into a repeatable scored audit
Paid upgrades (optional, faster/deeper)
Turns the audit's prediction into measured evidence once the page has real traffic
No access? Skip on a pre-launch template; use the checklist score alone
The process
2 steps
Step 01 of 02
The lesson's stranger test: a stranger reading only the headline, with zero other context, should immediately know what they'd get.
This template's hero headline reads 'Welcome to the Everything Store.' Does it pass the stranger test?
Procedure
- Paste the headline text into column A
- Score PASS/FAIL against 'names a concrete outcome, not a company tagline' in column B
- Write the fixed version in column C if it fails
HEADLINE: 'Welcome to the Everything Store.' SCORE: FAIL — names nothing a visitor would get FIX: 'Sell Anything, From One Simple Dashboard'
Healthy
The headline names a specific, concrete outcome the visitor gets, no company tagline language.
Unhealthy
The headline is a welcome message or a vague positioning line with no stated outcome.
What this means
37% of visitors leave within three seconds if they can't understand what a site offers — a failing headline is the single most expensive defect in the hero.
So what do I do about it?
| Symptom | Action | Effort |
|---|---|---|
| The headline is a company tagline instead of an outcome statement | Rewrite it to name the specific result a visitor gets, using the stranger test as the bar | 5 min |
Step 02 of 02
The Ofspace 2024 finding: 27% of startup hero sections had multiple equally-weighted CTA buttons, and those sites were nearly 3x more likely to also lack trust signals.
This hero has 'Start Free Trial' and 'Watch Demo' as two equal-sized buttons side by side. What does the formula say to do?
Procedure
- Count every CTA-styled button visible in the hero without scrolling
- Flag any hero with 2+ equally-weighted buttons
- Recommend which single action should stay primary and where the second action should move
CTAs FOUND: 2 ('Start Free Trial', 'Watch Demo'), both same size and color
FLAG: multiple equal-weight CTAs
RECOMMENDATION: keep 'Start Free Trial' as the primary button; move 'Watch Demo' to a smaller text link beneath itHealthy
One button carries clear visual weight; any secondary action is visually smaller or placed lower on the page.
Unhealthy
Two or more buttons compete for attention with identical size, color, and placement.
What this means
Multiple equal-weight CTAs don't just split clicks — the Ofspace data shows they correlate with missing trust signals, compounding the conversion problem.
So what do I do about it?
| Symptom | Action | Effort |
|---|---|---|
| Two buttons in the hero share the same visual weight | Demote the secondary action to a text link or smaller button beneath the primary CTA | 5 min |
Final deliverable
A scored audit sheet covering headline clarity and CTA count for the reviewed hero, with a pass/fail flag and a specific fix for each failure.
See a reference example
Glossybox hero audit (excerpt)
HEADLINE: 'Beauty, Delivered.' — FAIL, no outcome named
CTA COUNT: 1 ('Get Your First Box') — PASS
OVERALL: 1 of 2 components failing, headline needs a rewrite before launchSuccess criteria
You're done when you can:
- Correctly scores the headline against the stranger test with a specific fix if it fails
- Correctly counts and flags any hero with 2+ equal-weight CTA buttons