Follow

Emphasizing Content

For some reason, the makers of screen readers have decided not to announce some elements that users could benefit from, including:

 

Name

Description

<strong>

strong emphasis

<em>

emphasis

<q>

inline quotation

<pre>

preformatted text

<code>

computer code

<address>

contact info for the creators of a document

<time>

date and/or time

 

Since the elements above aren't read by screen readers you need a mix of visual and contextual indicators. Avoid using color alone to indicate required fields or the presence of errors.

 

Bad Example

This is the alert that needs to be understood.

 

Good Example

Using the word "Important" is a pretty good idea since asterisks aren't read consistently across screen readers. In the following example the Font Awesome <i> element includes aria-hidden="true".

 Important: This is the alert that needs to be understood.

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request