Visual styles in websites and documents are an important part of universal design for the web. This article will outline how content creators can design websites and documents with visual styles that a variety of visitors can use and enjoy.
Visual Styles in Websites and Documents
One principle of the Web Content Accessibility Guidelines (WCAG) requires that web content must be understandable. In addition, another WCAG principle requires content to be perceivable. In other words, people with a variety of disabilities should be able to perceive web content presented audibly or visually. Finally, WCAG requires websites to be robust, to work with current and future assistive technologies.
Visual styles can make websites or documents easy or difficult to read. As a result, content creators should design using visual styles that many people can perceive easily.
Fonts and Font Sizes
Changing fonts can be an engaging way to make content visually interesting or different. However, some fonts are easier to read than others. For example, serif fonts, such as Times New Roman, have extra lines or “tails” extending from letters. When people read these fonts with screen magnification, these extra lines sometimes separate from the letters. In contrast, sans serif fonts, such as Calibri, do not include these extra lines. As a result, people using screen magnification software can perceive each letter clearly.
While fonts make a difference for people using screen magnification software, people using screen readers cannot easily perceive fonts. Screen readers announce many changing features of text, such as:
However, screen readers do not announce changes in font or font size. It is possible to find out the font of a paragraph through keyboard commands. Nonetheless, someone using a screen reader does not perceive a font change unless they use the same keyboard command before every paragraph. In short, changes in font are not readily perceivable to screen reader users. As a result, font or font size are a way to emphasize information, but not for everyone. Therefore, content creators should not use only font or font size to emphasize important content. Instead, they should use styles that screen readers perceive, such as headings or lists.
Colour
Similarly, screen readers do not announce the colour of text automatically. Moreover, people who are colour blind may not perceive changes between certain colours, such as:
- Red and green
- Blue and yellow
Therefore, content creators should never use colour as the only way to emphasize content. However, they can use colour to distinguish content if they also use other methods.
Other Visual Styles
Likewise, screen readers do not automatically announce many other visual styles, such as:
- Highlighting
- Bolding
- Italics
Consequently, content creators should not emphasize content using only these styles. However, content creators can use all these styles if content is also emphasized in other ways.
For example, content creators of online learning may reveal correct answers using bolding, highlighting, or a change in colour. To alert all learners to the correct answer, content creators could also include the words “correct answer” in brackets. In this way, multiple methods make information perceptible to all visitors.