Emphasis is zero-sum

You cannot add importance, only redistribute it

A client asks for the phone number to stand out more. You make it bigger and bolder. A week later they ask for the logo to stand out more, so you make that bigger too. Then the offer. Then the opening hours. Six rounds later every element is large and bold, and the design communicates less than the first draft did.

Nothing went wrong in any individual round. The error is in the model. Emphasis is not a property you apply to an element; it is a relationship between an element and everything around it. There is a fixed amount of it on any given surface, and every time you give some to one thing you take it from the rest.

This is the most useful single idea in the course, because it converts an unanswerable request — make this stand out — into an answerable one: what comes down.

Three ranks, and a floor

A workable budget for one screen or one page:

• One primary. The single thing you want landed on first. Exactly one.
• Two or three secondaries. Found on the second pass, clearly below the primary and clearly above the rest.
• Everything else at the floor. Body text, labels, legal, navigation in its resting state.

The temptation is always to promote. Resist it by demoting instead: if something needs to rank higher, the faster and cheaper move is usually to take a channel away from whatever is currently competing with it, rather than to pile a channel onto it.

Worked example. A product page has a price at 24px bold black, an Add to Basket button in solid brand colour, a promotional badge in red, and a 20px bold black delivery promise. Four things fighting. The repair is not a bigger button. It is: delivery promise to 16px regular grey, badge to a quiet outline, price to 24px semibold. The button now wins without having changed at all.

Three primary buttons is no primary button

The pattern is visible everywhere once you know it. A form with Save, Save and Continue, and Publish, all in solid blue. A dashboard where every card has a coloured header. A homepage with four hero banners in a rotating carousel.

In each case somebody made a local decision that was individually defensible and collectively self-cancelling. The carousel is the purest example: it exists because several teams each needed the top slot, and the compromise gives every one of them a slot that most readers will never see, because the second slide arrives after most people have scrolled past.

Emphasis wears out

A channel used everywhere stops being a channel. If every heading on a site is in the brand orange, orange means heading, not important — and to make something important you now need a fourth channel you have not spent yet.

This is also why the resting state matters as much as the emphasised one. A button that is emphasised has to sit against buttons that are not. If every interactive element is filled and coloured, you have spent your loudest channel on the mere fact of interactivity, which is a poor use of it — most interfaces are better served by one filled button per view and outlined or plain-text treatments for everything else.

How to hold the line in a meeting

The request to make something bigger is almost never about size, and arguing about size is a losing game. Two sentences that work:

If we promote the delivery promise, the button has to come down. Which of those two do you want someone to see first?

And, when everything is already promoted:

We have four things at the top rank, so the reader is choosing at random which one they see first. Can we pick the one we would want if we only got one?

This usually resolves it, because the underlying disagreement was never visual. It was that two people wanted different things to be most important, and nobody had said so out loud.

A test you can run in ten seconds

Show the design to someone for three seconds, take it away, and ask what they saw. Not what it said — what they saw. If three people give three different answers, you do not have a primary. If they all name the same element and it is the one you intended, the budget is spent correctly.

This is cheap enough to do with whoever is sitting near you, and it is the only check in this lesson that tests the design rather than your reasoning about it.

The limit of the rule

One primary per view, not per document. A long page is a sequence of views, and each screenful can have its own primary — that is how a well-structured article works, with one dominant element in each section as you scroll. The budget resets as the reader moves. What it never does is expand to cover four things in the same glance.

There are also surfaces that genuinely have two peers: a comparison of two plans, a before and after, a choice between exactly two options. Those are real, and the answer is symmetry rather than hierarchy — make them deliberately equal, so the reader understands the tie is intentional rather than unresolved.