Scanning a newspaper is familiar. You can quickly locate the headlines, and which image belongs to which story. Newspapers are easy to scan because they have a visual hierarchy. Aim to create the same in your web content.
Make your web pages easy to scan so your audience can locate information quickly. Break up sections of text with sub-headings, lists and logical groups of related content. Start your page with an introduction that summarises the content of the page.
In this article:
Use headings to break up sections of continuous text within a page.
Also, use logical heading levels that convey the hierarchy of the page's information. For example, use the heading three style for a section within a topic that begins with a heading two style. Assistive technology such as screen readers, and search engines, use heading levels to perceive the structure of the content.
Bulleted and numbered lists are another way to make pages scannable and break up continuous text. For example:
- Facts in lists are more straightforward to comprehend or memorise
- The whitespace around an indented list helps the reader pause when scanning a page
- Numbered lists are ideal for instructions
Be sparing in how much you visually emphasise important content, for example, with box styles.
Consider the visual weight of an item. Use visual elements carefully and reserve them for important content. For example, a large button carries more visual weight (is more noticeable) than a few words of text.
Tip: when you highlight the majority of content with box styles, headings or bold, important content gets lost. Visitors will not know where to look first.
Advice and support
webteam at warwick dot ac dot uk