1.4.8 – Visual Presentation (Level AAA)

Offer users a range of presentation options for blocks of text.

Introduction

Users with visual or cognitive impairments may need to customise the presentation of your website to understand and enjoy it.

Some users require a certain background and foreground colour to comfortably read text. Others find long lines or justified text difficult to follow and some find it hard to read text where the lines and paragraphs are close together.

As each user has different needs, providing a range of user-selectable options helps the most people.

How to Pass

The following five features are cumulative, as all must be in place to pass:

1. Users can select background and foreground colours; and
2. Text blocks are no wider than 80 characters; and
3. Text is not justified to both sides of the webpage; and
4. Line spacing is at least space-and-a-half within paragraphs and
   paragraph spacing is at least 1.5 times larger than line spacing
5. Text can be resized in a browser up to 200% without requiring the user to scroll horizontally

Tips

Add all visual presentation options to the header of your website, so they are some of the first things users interact with.

The BBC’s accessibility page has a good range of colour and spacing options to cover features 1 and 4.

Feature 4, concerning line and paragraph spacing, can be difficult to understand, so here’s a more detailed breakdown:

• Text height must be changeable up to 150% of the default
• Spaces between paragraphs must always be 150% of the spaces between lines of text
• A good option is to give users some presets (like the ‘AAA’ element on the BBC’s accessibility page) of:
  • Default text height, line and paragraph spacing
  • 150% default text height, line and paragraph spacing
  • 200% default text height, line and paragraph spacing

You probably fulfilled feature 5 when you completed 1.4.4 – Resize text.

See Also

• Guideline 1.4.4 – Resize Text
• Understanding Success Criterion 1.4.8 (W3C)