What is visual style?
Visual style refers to any visual formatting of content that includes the use of:
- Italics
- Bolding
- Underlines
- Punctuation
- Spatial positioning or text spacing
- Colors
How should visual style be used?
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.
Using visual style alone to convey meaning is best illustrated by the following sentence common to many surveys and forms: “Required items are in red”. When the color or visual style of a piece of text, image, or element on the page is important to understanding the meaning of content, then that meaning should always be delivered in a different medium in addition to color or style.
Why is it important to not use visual style alone to convey meaning?
Not every reader has full color vision and full visual acuity to perceive all of the visual style you have provided in your content. If meaning is only conveyed through visual style, some of your readers will not be able to access that meaning.
While assistive technology can help in certain cases, 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 that are used to convey important information (such as the use of red and green to indicate incorrect and correct responses).
How do I avoid using visual style alone to convey meaning?
Think back to our first scenario where you were indicating required fields in red. The easiest approach to remove that accessibility barrier 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.
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 to define and provide a list of those words 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!