In April of 2024, the Department of Justice's final rule updating regulations for Title II of the Americans with Disabilities Act (ADA) was published with specific requirements about how to ensure that web content and mobile applications are accessible to people with disabilities. The Web Content Accessibility Guidelines (WCAG) Version 2.1, Level AA is now the technical standard for public entities' web content and mobile apps. While there are some exceptions such as archived content and preexisting social media posts, course content is required to meet this technical standard.
There are four main principles of WCAG: Perceivable, Operable, Understandable, and Robust.
Within each principle, content is further broken down by guidelines (there are a total of 13).
Under each guideline are success criteria. Each success criteria is labeled at a different level of conformance:
A (lowest)
AA
AAA (highest)
In order to meet AA level compliance, both A and AA level success criteria must be met.
WCAG 2.1 AA can be quite confusing and difficult to understand. Much of the success criteria within these guidelines are geared toward developers and will not be applicable in an instructor's every day work. Because of this, I've only included the applicable success criteria. This is not a complete WCAG success criteria list! For a complete list of the success criteria, check out WCAG in Plain English or WCAG 2.1.
Users must be able to perceive the information being presented (it can't be invisible to all of their senses).
Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols, or simpler language.
1.1.1 Non-text Content (A)
All non-text content (any content that is not a sequence of characters) that is presented to the user has a text alternative that serves the equivalent purpose.
Exception(s):
Decorative content should be implemented in a way that can be ignored by assistive technology
What does this mean?
Alt text must be added to all images, charts, audio, and other non-text content unless that content is decorative.
Provide alternatives for time-based media.
1.2.1 Audio-only and Video-only (Prerecorded) (A)
For prerecorded audio-only and prerecorded video-only media, the following are true, except when the audio or video is a media alternative for text and is clearly labeled as such:
Prerecorded Audio-only: An alternative for time-based media is provided that presents equivalent information for prerecorded audio-only content.
Prerecorded Video-only: Either an alternative for time-based media or an audio track is provided that presents equivalent information for prerecorded video-only content.
1.2.2 Captions (Prerecorded) (A)
Captions are provided for all prerecorded audio content in synchronized media, except when the media is a media alternative for text and is clearly labeled as such.
1.2.3 Audio Description or Media Alternative (Prerecorded) (A)
An alternative for time-based media or audio description of the prerecorded video content is provided for synchronized media, except when the media is a media alternative for text and is clearly labeled as such.
1.2.4 Captions (Live) (AA)
Captions are provided for all live audio content in synchronized media.
1.2.5 Audio Description (Prerecorded) (AA)
Audio description is provided for all prerecorded video content in synchronized media.
What does this mean?
Prerecorded audio-only:
Must have a corresponding transcript
Prerecorded video-only:
Must have text or audio description
Prerecorded videos with audio:
Must have synchronized captions that include all speech and relevant sounds
Important visual content in all prerecorded videos must have an audio description unless it is already explained in the main audio
Live video with audio:
Must include real-time captions that include all speech and relevant sounds
Create content that can be presented in different ways (for example, simpler layout) without losing information or structure.
1.3.2 Meaningful Sequence (A)
When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined.
1.3.3 Sensory Characteristics (A)
Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, color, size, visual location, orientation, or sound.
What does this mean?
The visual presentation of the content matches what's read out by a screen reader. We frequently refer to this as having the correct reading order.
Nothing is referred to just by its color, size, position, shape, and so on.
Make it easier for users to see and hear content including separating foreground from background.
1.4.1 Use of Color (A)
Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
1.4.2 Audio Control (A)
If any audio on a web page plays automatically for more than 3 seconds, either a mechanism is available to pause or stop the audio, or a mechanism is available to control audio volume independently from the overall system volume level.
1.4.3 Contrast (Minimum) (AA)
The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:
Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;
Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
Logotypes: Text that is part of a logo or brand name has no contrast requirement.
1.4.5 Images of Text (AA)
If the technologies being used can achieve the visual presentation, text is used to convey information rather than images of text except for the following:
Customizable: The image of text can be visually customized to the user's requirements;
Essential: A particular presentation of text is essential to the information being conveyed.
1.4.11 Non-text Contrast (AA)
The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s):
User Interface Components: Visual information required to identify user interface components and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author;
Graphical Objects: Parts of graphics required to understand the content, except when a particular presentation of graphics is essential to the information being conveyed.
1.4.12 Text Spacing (AA)
In content implemented using markup languages that support the following text style properties, no loss of content or functionality occurs by setting all of the following and by changing no other style property:
Line height (line spacing) to at least 1.5 times the font size;
Spacing following paragraphs to at least 2 times the font size;
Letter spacing (tracking) to at least 0.12 times the font size;
Word spacing to at least 0.16 times the font size.
Exception: Human languages and scripts that do not make use of one or more of these text style properties in written text can conform using only the properties that exist for that combination of language and script.
What does this mean?
Color must not be the only thing used to convey meaning.
Audio that plays automatically and lasts more than 3 seconds can be turned down or stopped.
There is a contrast ratio of 4.5 to 1. Large text can be a 3 to 1 ratio if it's over 24px or over 19px and bold.
Text must be actual text, not images of text, unless a specific visual presentation is absolutely necessary (i.e. logo).
Non-text graphical objects must meet a contrast ratio of 3:1.
Text should be spaced sufficiently for easy reading. This includes line spacing, paragraph spacing, letter spacing, and word spacing. Keep these in mind when choosing fonts.
Users must be able to operate the interface.
Provide users enough time to read and use content.
2.2.2 Pause, Stop, Hide (A)
For moving, blinking, scrolling, or auto-updating information, all of the following are true:
Moving, blinking, scrolling: For any moving, blinking or scrolling information that (1) starts automatically, (2) lasts more than five seconds, and (3) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it unless the movement, blinking, or scrolling is part of an activity where it is essential; and
Auto-updating: For any auto-updating information that (1) starts automatically and (2) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it or to control the frequency of the update unless the auto-updating is part of an activity where it is essential.
What does this mean?
Moving, blinking, scrolling, or auto-updating information that starts automatically, lasts more than 5 seconds, and is presented parallel to other content needs a mechanism to pause, stop, hide, or control the frequency unless is essential to the activity.
Do not design content in a way that is known to cause seizures or physical reactions.
2.3.1 Three Flashes or Below Threshold (A)
Web pages do not contain anything that flashes more than three times in any one second period, or the flash is below the general flash and red flash thresholds.
What does this mean?
Content must not flash, blink, or flicker more than three times per second, unless it stays within safety limits designed to avoid visual overload and reduce the risk of seizures.
Provide ways to help users navigate, find content, and determine where they are.
2.4.2 Page Titled (A)
Web pages have titles that describe topic or purpose.
2.4.3 Focus Order (A)
If a web page can be navigated sequentially and the navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning and operability.
2.4.4 Link Purpose (In Context) (A)
The purpose of each link can be determined from the link text alone or from the link text together with its programmatically determined link context, except where the purpose of the link would be ambiguous to users in general.
2.4.6 Headings and Labels (AA)
Headings and labels describe topic or purpose.
What does this mean?
Each page must have a unique and descriptive title that reflects its topic or purpose.
Focus must follow a logical and meaningful order that preserves relationships and matches how the page is naturally read, regardless of layout or language direction.
The purpose of each link must be clear from the link text itself, or the surrounding content.
Headings must describe what follows. Labels and buttons must clearly communicate what information is needed or what action will happen.
Users must be able to understand the information as well as the operation of the interface.
Make web pages appear and operate in predictable ways.
3.2.3 Consistent Navigation (AA)
Navigational mechanisms that are repeated on multiple web pages within a set of web pages occur in the same relative order each time they are repeated, unless a change is initiated by the user.
3.2.4 Consistent Identification (AA)
Components that have the same functionality within a set of web pages are identified consistently.
What does this mean?
Be consistent with link text and navigation targets.
Help users avoid and correct mistakes.
3.3.2 Labels or Instructions (A)
Labels or instructions are provided when content requires user input.
What does this mean?
Add labels and/or instructions to forms to clarify expectations of user input.
Users must be able to access the content with a variety of user agents, including assistive technologies.