Providing Emphasis

First published: 2nd March 2022
Last updated: 2nd March 2022
Summary

Using visual emphasis appropriately is helpful in conveying meaning, but assistive technology doesn't always read out formatting, so if the emphasis is critical to understand the text — then you'll need to find another way to  communicate emphasis.

 

Text formatting - such as bold and italic - can help with legibility and comprehension of text if they are used correctly.

Screen readers can be configured to be more or less verbose. While most can be configured to change the tone of voice on coming across strong, emphasis and strikethrough tags , we shouldn't rely on them doing so. 

If the emphasis is critical to conveying meaning, you should add an additional method of drawing attention.

For example

  • Add some additional text such as "Important: ... " 
  • Add some text which is only visible to screen readers
  • Add an icon with appropriate alt text.

It is important not to overuse text formats. Avoid making large pieces of texts italisied; studies show that blocks of italic text decreases reading performance for people with dyslexia. On the other hand, highlighting one or two important words can help with legibility. 

WRITING IN UPPERCASE 

Text written in all uppercase appears quite SHOUTY, and it is also harder to read. 

To add to this, it can result in unexpected pronunciation by screen readers – for example CONTACT US is often pronounced ‘Contact U.S.’ by a screen reader. 

HTML elements

There is a technical difference between the various HTML tags we can use for emphasis. 

Bold <b> and italic <i> tags are generally not announced by screen readers, so their importance will not be communicated to readers who are only using a screen reader.

The emphasis <em> and strong emphasis <strong> tags can (see above) be announced by a screen reader, and are usually appear the same as their counterparts (italic and bold respectively). Generally it makes sense to use the <em> and <strong> tags. 

If you don't know which your site outputs, please ask us to check it for you.