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
- Write one clear headline that says what you do.
- Keep one main button in your brand colour.
- Put the phone number or contact link where people expect it: the top right or the header.
- 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?