Resources / Writing / Everything your hero section needs (and nothing else)

Everything your hero section needs (and nothing else)

Six parts, four real heroes, one checklist to steal

What we put in every homepage hero at Conversion Factory, with Prisma, Tandem, RadioCult, and our own site as proof.

Your hero section is the only part of your homepage you can guarantee everybody sees.

Everything below it has to be earned. Some visitors scroll, plenty don’t, and the ones who leave made that call based on whatever loaded first. So the hero isn’t a banner, and it isn’t a mood board.

The hero isn’t the intro to your pitch. It is the pitch.

Here’s what we put in every hero we build at Conversion Factory, with four of them as proof: Prisma, Tandem, RadioCult, Dabble, and our own.

1. A strong headline

It has to be readable at a glance, and it should be the biggest thing in the hero unless you’ve deliberately accented something else. Say what you do and what somebody gets out of it, not what you believe about the future of work.

Prisma’s is “Your TypeScript app, from prompt to production.” Who it’s for, what it does, and how far it takes you, in seven words.

2. A subhead that does the explaining

The headline earns the attention and the subhead spends it. This is the explanatory piece, and it should sit clearly below the headline in the hierarchy, smaller and quieter.

Ours does the split on purpose. The headline is the heavy hitter, “Distribution is the only moat left. We help you build it.” The subhead says what we actually do, a little more eloquently: top-tier marketing and design under one roof, with an embedded senior team that’s accountable to MRR.

3. Objection busters

Three short lines, sometimes four, each one with a checkmark or a bullet next to it. They’re the things a visitor is probably already worried about, answered before they have to ask.

Prisma’s are “One platform, one stack, one bill,” “A CLI and API your agent drives natively,” and “The ORM is free, always.”

Tandem sells auction management software, so theirs are concierge onboarding, top-notch data security, and automatic data backups and recovery. Different worries, same job.

The checkmark/bullet is doing more work than it looks like. It says yes, we have that before anybody reads the sentence next to it.

4. Social proof

This comes in a lot of shapes, so pick the one your buyer actually trusts. Prisma is a developer tool, so it speaks developer: “Trusted by 500,000+ developers” and “46,500+ GitHub stars,” right under the buttons.

Ours says “100+ startups trust Conversion Factory,” with a rotating pool of client logos underneath.

A testimonial works too, as long as it’s short enough to read in passing and comes from somebody your buyer recognizes. Reform, the form builder, pins one from Justin Jackson, co-founder of Transistor.fm, right on top of its product screenshot: “Early user of Reform here! Loving the simplicity; I’ve already switched some things from Typeform to Reform.” One name, one sentence, and it quietly takes a shot at the competitor for them.

Reform stacks a second kind on top, too: a “#1 Product of the Week” Product Hunt badge sitting above the headline. An award is proof, and it’s the first thing you read.

5. A call to action that stands apart

One primary button, and it should look different from everything else in the hero. Prisma’s “Get started free” is a black button with color glowing behind it, so it lifts off a near-white background without having to shout.

Secondary actions are fine as long as they look secondary. RadioCult runs three: start the free trial, book a call, and a little play button for their video, each one quieter than the last.

6. The product, or the people it’s for

Show people what they’re signing up for. Prisma doesn’t have room for a screenshot up top, so the product peeks in at the bottom of the hero, which tells you to scroll and tells you that’s where the product starts. All of which is a slightly abstracted version of their software, developed in code.

Tandem uses an abstracted version: a wall of real auction items (a typewriter, a clock, a carved mask, a set of gold rings) each tagged consigned, catalogued, sold, or dispatched. You get what the product does without squinting at a dashboard.

RadioCult skipped the product entirely and showed the people it serves: musicians, artists, independent radio hosts.

Dabble went a step further and included an interactive demo walking a prospect through the core features of the product in a delightful, easily discernable fashion.


You don’t need all six

Our own site has no objection busters. Tandem has no social proof, because auction houses are a skeptical crowd. Both heroes still work, because every part that made the cut is pulling its weight.

Obviously, if you can, include as much as possible, better to hit all of these checkboxes because they will give your prospects more reason to keep scrolling and exploring.

Go count the parts on your homepage. If you’re under four, start with the objection busters. They’re three lines of copy and a checkmark, and they’re the cheap to add.

— Zach