The three-second rule, from billboards to hero sections

When I designed the Joey & Lauren Morning Show billboard, the brief came with a rule I already knew from radio: a driver at highway speed gives you about three seconds. If the message isn’t landed by then, it never lands.

That constraint made the design easy in a way that’s worth unpacking, because it applies far beyond billboards.

What three seconds forces

• One idea. The billboard has the show’s name, the station, and the hosts’ faces. That’s it. Any “also” gets cut.
• Contrast over decoration. Big type on a flat, high-contrast field beats a beautiful gradient nobody can read from a car.
• Hierarchy you can feel. The eye should know where to go first without thinking. If two elements compete, one of them is wrong.

The same rule on a screen

A hero section is a billboard with a scroll bar. Most people who land on a site decide in the first screen whether to keep reading. So I treat the hero the same way:

1. One headline that says what you do, not what you value.
2. One supporting sentence.
3. One primary action, one secondary.

The hero on this site follows that recipe. “Where code meets creativity” tells you the shape of the work. The sentence under it says who I am and who I’ve done it for. Then two buttons. Everything else is below the fold on purpose.

Where it gets harder

Social ads are the extreme version. On Facebook and Instagram you don’t get three seconds, you get the length of a thumb flick. For the Iliad Media Group free advertising campaign, I built each creative around a single visual hook and tested it at phone size before anything else. If the offer wasn’t obvious at 400 pixels wide, the layout went back.

A checklist I actually use

Before I call a layout done, I look at it for three seconds and then look away. Then I ask:

• What did I read first?
• What did I read second?
• Could I say what this is for?

If any answer is “not sure,” it’s not done. Works for a billboard, a brochure cover, or a homepage.