Skip to main content
U.S. flag

An official website of the United States government

Official websites use .gov
A .gov website belongs to an official government organization in the United States.

Secure .gov websites use HTTPS
A lock ( ) or https:// means you’ve safely connected to the .gov website. Share sensitive information only on official, secure websites.

Layout and hierarchy

Can you quickly understand the meaning of the page and complete your task?

Why it’s important: Avi is distracted and needs to fill out an important web form

View more

Benny has attention deficit disorder and has trouble staying focused on busy pages

Juanita doesn’t feel confident about using technology because she previously wasn’t able to find what she was looking for.

Steps to take

  • Make sure key information is discernable at a glance. Design minimally and intentionally so that the user can get as much info as quickly as possible.
  • Create a clear hierarchy of importance by placing items on the screen according to their relative level of importance. For example, place important actions at the top or bottom of the screen (reachable with shortcuts).
  • Plan heading structure early. Ensure all content and design fits into a logical heading structure.
  • Consider reading order. The reading order should be the same as the visual order.
  • Group related items in proximity to one another to help those who have low vision or trouble focusing on the screen.


WCAG 2.0 references


Contact: Questions or comments? Please file a GitHub issue or email