Visual hierarchy, explained without the jargon

We end up explaining this on discovery calls often enough that it deserved writing down. Here is visual hierarchy without the vocabulary that usually surrounds it.

Consistency is the quiet half of design work: it rarely gets complimented, and its absence is noticed immediately. Doing this properly once is usually cheaper than doing it approximately three times.

The short version

Every screen should have one obvious first thing to look at. It is worth being explicit about, because assumptions differ quietly. The practical test is whether someone new to the project could tell, in a minute, that it had been handled.

Why people complicate it

Most of the confusion comes from tooling rather than from the idea itself. This is the sort of thing that compounds, quietly, in both directions.

Size, weight, and colour do the work that arrows and boxes cannot. That sounds obvious written down. It is still the thing most often skipped. The failure mode is not doing it wrong, it is doing it once and assuming it stays done.

A reasonable first step

If everything is emphasised, nothing is. Where this goes wrong is almost never a lack of knowledge. The teams that stay on top of it are the ones who put it on a calendar rather than a wish list.

The short version

The measurable part of design is whether people can find what they came for and act on it without hesitating. Three things worth confirming about visual hierarchy before you move on:

• Someone can say what the current setup is without going to look
• If everything is emphasised, nothing is — and you know whether that is true here
• There is a way to tell whether the last change to this helped

Pick the one that would hurt most if it failed, and start there.