Skip to content
Free website audit — see why your site loses customers. Get yours
MakeAndUpdate

Journal · The Clarity Series · The basics

What is a hero section?

By Nicholas Cabel The 60-second version lives on Instagram

Your hero section is the top screen of your homepage, the first thing anyone sees. It needs four parts: a headline, a subheadline, one call to action, and a visual.

In plain English

It is a five-second test that must answer three questions fast: who are you, what do you offer, and what do I do next.

Three reasons heroes fail

01

A vague headline

Clever wordplay that never says what you actually do.

02

A buried call to action

The one button that matters is small, gray, or below the fold.

03

A visual that is just decoration

An image that fills space instead of reinforcing the message.

Worth remembering

NN/g found people spend 80% of their viewing time above the fold, the exact screen your hero fills.

Most of the attention you will ever get from a visitor happens before they scroll once. If your hero does not land, the rest of the page rarely gets the chance to.

What to do about it

Your hero section is doing more work than any other part of your site, whether it is built to or not. Get a free website audit and I will show you whether yours passes the five-second test.

About the author

  • Nicholas Cabel

    Written by

    Nicholas Cabel

    Founder of MakeAndUpdate, a one-person web studio in West Chester, PA. Hand-codes fast websites for local businesses and builds in public.

    @makeandupdate