Above-the-fold: the 3 questions every hero section must answer
Three questions, three seconds. If your hero does not answer Who, What, and How within three seconds, visitors bounce — and no amount of clever scrolling content will save you. The hero is not a place for cleverness; it is a place for clarity.
Who you are: brand, logo, voice. The visitor needs to know they are in the right place. This sounds obvious, but a shocking number of homepages bury the brand below decorative imagery or open with a vague aspirational headline that could belong to any company in the category.
What you do: the product or service in plain English. Not your category. Not your aspiration. Not your inside joke. If your mom cannot read your H1 and tell a friend what you sell, the H1 is wrong. We rewrite roughly 80% of client headlines because they read like brand briefs instead of clear product statements.
How you help: the outcome the buyer cares about. 'Email marketing software' is a category. 'Send emails customers actually want to open' is an outcome. The outcome is what gets the buyer to scroll, click, or sign up.
We tore down five real homepages last week and rebuilt the hero of each. The patterns repeat: long aspirational headlines that mean nothing, two equally-weighted CTAs that paralyze the visitor, hero imagery that has nothing to do with the product, and a navigation bar with 11 items that signals 'we don't know what we want you to do here.'
The rebuild template we use is simple. H1 is one line, eight to twelve words, benefit-led. Sub-headline is one sentence, twenty to thirty words, naming the audience and the offer. One primary CTA, action-led. One secondary CTA, lower visual weight, for visitors who want to learn more before committing. Hero imagery shows the product in use or the result of using it — never abstract gradients, never stock photos of business people pointing at laptops.
Trust signals belong above the fold, but small. Three to five customer logos, a star rating with review count, or a press mention strip. They reassure without competing for attention. We have measured 6 to 10% lifts on hero conversion just from adding a small trust strip below the primary CTA.
Mobile is where most heroes break. The desktop hero that looks balanced gets compressed on mobile, the H1 wraps awkwardly, the imagery pushes the CTA below the fold, and the visitor has to scroll twice before seeing a button. We design the mobile hero first, then expand to desktop — never the reverse.
Speed matters as much as content. A hero that takes 4 seconds to render fails the three-second rule no matter how perfect the copy is. Hero images get preloaded with `fetchpriority="high"`, fonts get preloaded for the H1 weight only, and any animation is GPU-accelerated CSS — never JavaScript that blocks paint.
If you read nothing else: rewrite your H1 today. Make it a benefit, not a brand statement. Make it readable in plain English. Make it answer 'what's in it for me?' That single change, on its own, reliably moves homepage conversion by 8 to 15% on the sites we audit.
Ready to apply this to your site?
Get a fixed-scope quote in under two minutes.