Consistent identification – accessibility for web writers

Use icons and their text alternatives consistently throughout your content.

If you use different icons or labels for content or functions on different pages, you can make your site harder to use—particularly for people with cognitive impairments.

While designers are generally responsible for icons and developers for labels, web writers and content managers have a role to play too. Here are some tips.

Use document icons consistently

If you use an icon to label a document in a format such as PDF, then

  • use the same icon throughout your site
  • write a consistent text alternative.

It’s also a good idea to use icons users will be familiar with, rather than something unique that users may not easily recognise.

Page Before (different icons, different text alternatives) After (same icon, same text alternative)
1

Word icon, style 1 alt=”Word document”

PDF icon, style 1 alt=”pdf document”

Word icon, style 3 alt=”Word document”

PDF icon, style 3 alt=”PDF document”

2

Word icon, style 2 alt=”download doc”

PDF icon, style 2 alt=”download Adobe file”

Word icon, style 3 alt=”Word document”

PDF icon, style 3 alt=”PDF document

3

Word icon, style 3 alt=”get Word version”

PDF icon, style 3 alt=”get PDF version”

Word icon, style 3 alt=”Word document”

PDF icon, style 3 alt=”PDF document

Use other graphics consistently

Ensure that all icons or graphics included in your content are used consistently. These might include icons that indicate links to external pages, links that open content in new windows or pop-ups, or links to the next page in a multi-page document.

Document these requirements in your style guide

If you’re a site or content manager, provide guidance on the use and labelling of icons in your style guide. Make sure all your web writers are aware of the guidelines and know how to apply them.

If you’re a web writer, check your style guide or contact your web content manager to see what is recommended.

References