Skip to content
← Academy

Lesson 001 · Design Principles 101 · 3 min

The 5-second crime

Principle: Visual hierarchy

1 · The crime

What goes wrong

You land on a homepage. Quick: what does this company do, and how do you contact them? Time's up. If you can't answer in five seconds, the page has committed a hierarchy crime.

2 · The law

Visual hierarchy

  • Size: the most important thing is the biggest.
  • Contrast: one bold colour for one main action.
  • Position: people read the top first, then left to right in English and right to left in Arabic.
  • Space: important things get room to breathe.

3 · The tool

Check it yourself, for free

  • Take a screenshot of your homepage and blur it. Whatever still stands out is what visitors see first.
  • Show the page to a friend for five seconds, then ask: what do we do, and what should you click?

4 · The fix

Step by step

  1. Write one clear headline that says what you do.
  2. Keep one main button in your brand colour.
  3. Put the phone number or contact link where people expect it: the top right or the header.
  4. Remove or shrink anything that competes with those three.

5 · Homework

Blur-test your own homepage and note what stands out. Is it the thing you want people to do?