MyLeoNes™

Visual hierarchy — Design, 11–13

Visual hierarchy helps people notice the most important part first. Designers create it by changing size, position, colour, spacing and contrast.

What visual hierarchy is

When a page has a title, a picture and several bits of text, your eyes do not treat them all equally. Visual hierarchy arranges them so the eye can tell what to notice first, next and last.

Why it is needed

People often look at a design for only a few seconds, and a crowded page can make every message compete. Hierarchy solves this problem by guiding attention, so someone can find the main point without reading everything.

A worked example

Imagine a poster for a school book swap. First, make “BOOK SWAP” large and dark; second, place the date beneath it in medium text; third, put the small details at the bottom. The eye now gets the event, time and instructions in that order.

The common mistake

A common mistake is making every heading huge, bright or bold because each one feels important. That is reasonable: the designer wants nothing to be missed, but equal emphasis removes the signposts that help people choose where to look first.

Where it appears

You meet visual hierarchy on maps, websites, menus, instruction sheets and shop signs. A map uses larger labels for important places, while a menu makes the dish name, price and description easy to scan.

Keep exploring

Other languages

Loading MyLeoNes™…