Objective: Content is programmatically tagged to provide machine-readable cues to assistive technology. All content is understandable regardless of ability.

Tools: Browser with Developer Tools, multiple representative webpages.

Language

Language

Is the page language declared and language changes marked? Use the standard two-character ISO 639-1 language code when designating a language.

Page language is accurately identified, using the standard language code on the <html> element (e.g. <html lang="en"> or <html lang="fr">): Assessment: 15.1 Language of page
Identify inline language changes with the lang attribute (e.g. <span lang="es">: Assessment: 15.2 Language of parts

How to test

When I inspect the HTML using Developer Tools, I see (or hear if using a screen reader) an accurate language attribute set in the top-level <html> tag (e.g. lang="en-US" for English).

AND if there is text in a language different from the main language AND I inspect the HTML for that text using Developer Tools, I see (or hear if using a screen reader) an accurate language attribute is set for the element.

Practice testing language

Adapted from the Language Checklist.

Alternate text for images

Alternate text for images

Alternate text should be concise (less than 250 characters), does not restate that the element is an image (avoid phrases like "image of" or "picture of"), and is expanded upon with an extended description if needed. Colorblind people need sufficient color contrast, and use real text instead of images of text.

Images are properly coded as meaningful (alt attribute has content) or decorative (null alt text (alt="") or with ARIA role="presentation"): Assessment: 14.1 Image function
The alternative text serves the equivalent purpose as the image: Assessment: 14.2 Text alternative
If an image is a link, the alt text describes the destination of the link.

How to test

Check that the text description accurately represents the image:

With WAVE: run WAVE, it will overlay accessibility information on the page. Images should display their alternate text near the image.
With Accessibility Insights: go to Assessment 14.2 Text alternative. At the bottom is a list of instances with their accessible name (alt text).
Browser only: use the inspector by right-clicking on the image and selecting "inspect element". This opens the code inspector to the image element. It should have an "alt" with text that matches the image.

Practice testing alternate text for images

Adapted from Image Checklist.

Links

Links

A link takes a person to another page or part of a page using the <a href="url"> element (href is required to be a link); include if it goes to an external site or a new window. The purpose of a link must be described by its link text with no redundant words like "click here" or "learn more".

A link's purpose is clear from its accessible name: Assessment 7.2 Link purpose
If the link has a hidden accessible label, it must match or at least contain the exact text of the visible text if it exists: Assessment 7.3 Label in name

How to test

When I view the content, I understand where all the links go.

Practice testing links

Adapted from Link Checklist.

Lists

Lists

Lists must be contained within semantically correct containers.

Lists use <ul> for unordered lists and <ol> for ordered lists with <li> for each list item; for description lists, it uses <dl> with <dt> for the term and <dd> for the definition: Assessment 22.5 Lists

Practice testing lists

Adapted from List Checklist.

Video and audio

Video and audio

Media needs captions or transcripts with 99% accuracy to maintain viewer understanding, and any background noise should be minimized during spoken word. The media player also needs to be accessible.

Pre-recorded audio-only content is accompanied by an equivalent text alternative: Assessment 18.1 Audio-only equivalent
Pre-recorded video-only content must be accompanied by an equivalent text or audio alternative: Assessment 18.2 Video-only equivalent
Pre-recorded multimedia (video and audio) has captions that do not obstruct info: Assessment 19.1 Captions Assessment 19.2 No obstruction
Pre-recorded video with audio has synchronized audio description that doesn't overlap other audible information: Assessment 19.3 Audio description Assessment 19.4 Synchronization Assessment 19.5 No conflict

How to test

Video-only: I see or hear text and/or audio description of the video content.
Audio-only: I see a text transcript of the audio content.
Video and audio: I see captions for the audio content, and I see or hear text and/or audio description of the video content.

Practice testing video Practice testing audio

Adapted from Audio and Video Checklist.