Using Visual Style to Convey Meaning

Imagine you’ve created a form that your colleagues need to complete, and questions that are required are in red text. However, unbeknownst to you, you have a colleague who is colorblind who is unable to perceive which questions are required. This is an example of an accessibility barrier caused by using visual style on its own to convey meaning.

Visual style includes the use of:

  • Italics
  • Bolding
  • Underlines
  • Punctuation
  • Spatial positioning or text spacing
  • Colors

Adding visual style to your document can be very helpful for improving the comprehension of sighted readers. However, visual styles should never be the only way that meaningful information is conveyed.

One reason for this recommendation is that color and style aren’t regularly announced by screen readers to blind or low vision individuals. Therefore, screen reader users may miss the meaning conveyed by a visual style if it’s not also communicated in a second way (such as in the written text). Additionally, people who are colorblind may not be able to distinguish certain colors (like red and green!) that are used to convey important information.

How do I avoid using style alone to convey meaning?

Think back to our first scenario where you were indicating required fields in red. How might you remove that accessibility barrier? The easiest approach is to just add “(required)” at the end of the name of each required field. You can still make required fields red, but the important thing is that there should be another way besides color to distinguish between required and non-required fields.
two forms with required fields in red; the accessible form has the word “required” at the end of the field names.

In another example, let’s suppose you are an instructor who wants your students to define specific terms within a passage. Instead of telling students to “define the underlined words,” you could underline the words and provide a list of the words they need to define at the end of the passage.

Style is often used to visually mark the title of each section in a document. That is tremendously helpful for sighted readers, but in addition to visual styles like bold or large text, make sure you also tag the titles of sections as headings so that they can be detected by assistive technology.

Another common way that color alone is often used to convey meaning is when people indicate the presence of a hyperlink by changing the color of text without underlining the link text. For example, someone with color blindness may not be able to detect the following link, which uses color alone to indicate that it is a hyperlink: Digital Accessibility Office. Make sure you always underline your links!

May Challenges

Review a syllabus, email, or document that you’ve recently created, and locate places where you use color or style to convey meaning.

Is there a way to access that meaning besides perceiving the color, punctuation, font style, or other visual style? If not, find an additional way to convey that meaning.