Skip to main content

Convey Information with Proper Elements

As an instructor, do you ever tell students to “read carefully the text in bold and italics,” “look at the item within the circle,” or "click the red button"? Although students with vision can use this information effectively, a learner using a screen reader will be unable to interpret the instructions. Why? Because screen readers typically do not translate bold, italics, underlining, color, shapes, and other elements affecting visual appearance.

The issue is similar for those students with color blindness. When you use color as an identifier on your course site or in a document, there's a fair chance that a few students will not be able to use your instructions effectively.

How do you emphasize content or direct students properly, then? Try one of these methods:

  • A highly effective technique that will serve all audiences well is to place a small icon denoting significance, such as an exclamation icon, just prior to the statement that you feel is essential. Ensure that you also provide alt text (e.g., alt="Important") for the icon. The screen reader will tell its user that the text that follows is "important," and the icon will also make the statement stand out for those without vision impairments.
  • Even simpler is to provide the word "Important" or "Note" just before the statement that you feel is essential. The screen reader user and users without vision impairments alike will then "read" the statement as it is written. One advantage of using an icon, however, is that a sighted user is more likely to pay special attention to the icon and, thus, the statement.

Important!Using an icon to signify emphasis can catch the eye of all audiences, as long as meaningful alt text is also present.

Support Resources

Coblis: Color Blindness Simulator

Open /*deleted href=#openmobile*/