Part 2 · Attention and Perception

Change Blindness and Visual Hierarchy

Important content can be overlooked when a page gives everything equal visual weight. Hierarchy helps someone locate the main offer and the next action, while necessary details remain available for a more careful review.

Change Blindness and Visual Hierarchy · Illustrated by Hendra Saputra with AI assistanceSelect the illustration to explore it at a larger size.

The idea

Attention is selective, so adding information does not ensure that the added information will be noticed. The illustration compares crowded and clear versions of the same discount context, using size, contrast, position and whitespace to change emphasis; it does not establish a universal eye-movement pattern or prove that fewer words always perform better. Review what the viewer should notice first, second and third, then test that sequence with people who have not already learned the campaign from its briefing document.

Use it thoughtfully

  • Choose one clear first point of attention.
  • Use size, contrast, position and whitespace deliberately.
  • Keep offer terms consistent when testing layouts.

An example

In an illustrative retail page, the same selected-item discount is buried among many competing boxes in one layout. Another puts the discount and Shop Now button first, with supporting details nearby, and the team checks whether visitors understand both the offer and its limits.

A question to try

If someone glances at the page briefly, what will they notice first and what might they miss?

A useful framework is a starting point, not a guarantee. Effects vary with the audience, product and situation. Use truthful evidence, respect customer choice, and test the result.

Connect the ideas

Illustration

Use + and − to zoom, scroll to explore, or Escape to close. Please seek permission before reusing an illustration.