WCAG 2.2 Demo SuiteAll WCAG 2.2 success criteria
Every one of the 86 success criteria in WCAG 2.2, each with a failing example, a passing example, and a testing procedure. Filter the list below, or browse by principle and guideline.
- 31Level A criteria
- 24Level AA criteria
- 31Level AAA criteria
- 86Total in WCAG 2.2
Conformance is cumulative
A Level AA claim requires all 31 Level A criteria and all 24 Level AA criteria — 55 in total. A Level AAA claim adds the remaining 31. Most legislation and procurement policy targets AA; W3C does not recommend AAA as a general policy for entire sites.
Showing all 87 criteria.
Principle 1: Perceivable
Information and user interface components must be presentable to users in ways they can perceive. If a user cannot perceive it, nothing else about the interface matters.
1.1 Text Alternatives
-
1.1.1 Non-text Content
All non-text content has a text alternative that serves the equivalent purpose. Decorative images are given an empty alt attribute so assistive technology ignores them.
1.2 Time-based Media
-
1.2.1 Audio-only and Video-only (Prerecorded)
Prerecorded audio-only content has a text transcript. Prerecorded video-only content has either a transcript or an audio track describing what is shown.
-
1.2.2 Captions (Prerecorded)
Captions are provided for all prerecorded audio content in synchronised media. Captions carry dialogue plus speaker identification and meaningful non-speech sound.
-
1.2.3 Audio Description or Media Alternative (Prerecorded)
Prerecorded video in synchronised media has either an audio description of the visual information or a full text alternative for the whole presentation.
-
1.2.4 Captions (Live)
Captions are provided for all live audio content in synchronised media — webinars, live streams, virtual events.
-
1.2.5 Audio Description (Prerecorded)
Audio description is provided for all prerecorded video content. At AA the text-alternative escape hatch allowed at 1.2.3 is removed — a real described audio track is required.
-
1.2.6 Sign Language (Prerecorded)
Sign language interpretation is provided for all prerecorded audio in synchronised media.
-
1.2.7 Extended Audio Description (Prerecorded)
Where the pauses in the foreground audio are too short to carry adequate description, extended audio description pauses the video to allow a longer description.
-
1.2.8 Media Alternative (Prerecorded)
A full text alternative is provided for all prerecorded synchronised media and for prerecorded video-only media.
-
1.2.9 Audio-only (Live)
A text alternative presenting equivalent information is provided for live audio-only content, such as a live radio broadcast or audio-only conference call.
1.3 Adaptable
-
1.3.1 Info and Relationships
Structure and relationships conveyed visually are also available programmatically. Headings are headings, lists are lists, tables have header cells, and form fields have real labels.
-
1.3.2 Meaningful Sequence
When the order in which content is presented affects its meaning, a correct reading sequence can be determined programmatically. The DOM order must match the logical reading order.
-
1.3.3 Sensory Characteristics
Instructions do not rely solely on shape, colour, size, visual location, orientation, or sound. "Click the round button on the right" fails; "select Continue" passes.
-
1.3.4 Orientation
Content does not restrict its view to a single display orientation such as portrait or landscape, unless a specific orientation is essential.
-
1.3.5 Identify Input Purpose
The purpose of each input field collecting information about the user can be determined programmatically, using the HTML autocomplete attribute with the standard token list.
-
1.3.6 Identify Purpose
The purpose of user interface components, icons, and regions can be determined programmatically — extending 1.3.5 beyond form fields to the whole interface.
1.4 Distinguishable
-
1.4.1 Use of Color
Colour is not the only visual means of conveying information, indicating an action, prompting a response, or distinguishing an element.
-
1.4.2 Audio Control
If audio plays automatically for more than three seconds, a mechanism is available to pause, stop, or independently control its volume.
-
1.4.3 Contrast (Minimum)
Text and images of text have a contrast ratio of at least 4.5:1, or 3:1 for large text (18pt, or 14pt bold). Logos and incidental text are exempt.
-
1.4.4 Resize Text
Text can be resized up to 200% without assistive technology and without loss of content or functionality.
-
1.4.5 Images of Text
Text is used to convey information rather than images of text, except where the presentation is essential (logotypes) or the image is customisable by the user.
-
1.4.6 Contrast (Enhanced)
Text and images of text have a contrast ratio of at least 7:1, or 4.5:1 for large text.
-
1.4.7 Low or No Background Audio
For prerecorded audio that is primarily speech, background sound is either absent, switchable off, or at least 20 dB below the foreground speech.
-
1.4.8 Visual Presentation
Blocks of text meet five requirements: user-selectable foreground and background colours, width of no more than 80 characters, no full justification, line spacing of at least 1.5 within paragraphs and 1.5 times that between them, and resizable to 200% without horizontal scrolling.
-
1.4.9 Images of Text (No Exception)
Images of text are used only for pure decoration or where a particular presentation is essential. The AA allowance for customisable images is removed.
-
1.4.10 Reflow
Content can be presented at 320 CSS pixels wide without loss of information or functionality, and without requiring scrolling in two dimensions. Data tables, maps, and code blocks are exempt.
-
1.4.11 Non-text Contrast
User interface components and meaningful graphical objects have a contrast ratio of at least 3:1 against adjacent colours — input borders, focus indicators, icons, and chart elements.
-
1.4.12 Text Spacing
No loss of content or functionality when the user sets line height to 1.5× the font size, paragraph spacing to 2×, letter spacing to 0.12×, and word spacing to 0.16×.
-
1.4.13 Content on Hover or Focus
Additional content triggered by hover or focus must be dismissable without moving the pointer or focus, hoverable so the pointer can move onto it, and persistent until dismissed or no longer valid.
Principle 2: Operable
User interface components and navigation must be operable. Every user must be able to drive the interface, whatever input device they use.
2.1 Keyboard Accessible
-
2.1.1 Keyboard
All functionality is operable through a keyboard interface, without requiring specific timings for individual keystrokes.
-
2.1.2 No Keyboard Trap
If focus can be moved to a component using the keyboard, it can be moved away again using only the keyboard. If a non-standard key is needed to exit, the user must be told.
-
2.1.3 Keyboard (No Exception)
All functionality is keyboard operable with no exception for functions that require path-dependent input such as freehand drawing.
-
2.1.4 Character Key Shortcuts
If a shortcut uses only letter, punctuation, number, or symbol characters, it can be turned off, remapped, or is active only when the relevant component has focus.
2.2 Enough Time
-
2.2.1 Timing Adjustable
For each time limit, the user can turn it off, adjust it to at least ten times the default, or extend it with a simple action after a warning with at least 20 seconds to respond.
-
2.2.2 Pause, Stop, Hide
Moving, blinking, or scrolling content that starts automatically, lasts more than five seconds, and runs alongside other content can be paused, stopped, or hidden. The same applies to auto-updating content.
-
2.2.3 No Timing
Timing is not an essential part of the event or activity presented, except for non-interactive synchronised media and real-time events.
-
2.2.4 Interruptions
Interruptions can be postponed or suppressed by the user, except those involving an emergency.
-
2.2.5 Re-authenticating
When an authenticated session expires, the user can continue the activity after re-authenticating without losing any data.
-
2.2.6 Timeouts
Users are warned about the duration of any inactivity that could cause data loss, unless the data is preserved for more than 20 hours of inactivity.
2.3 Seizures and Physical Reactions
-
2.3.1 Three Flashes or Below Threshold
Content does not contain anything that flashes more than three times in any one second, unless the flash is below the general flash and red flash thresholds.
-
2.3.2 Three Flashes
Content does not contain anything that flashes more than three times in any one second, with no threshold exception at all.
-
2.3.3 Animation from Interactions
Motion animation triggered by interaction can be disabled, unless the animation is essential to the functionality or information.
2.4 Navigable
-
2.4.1 Bypass Blocks
A mechanism is available to bypass blocks of content repeated on multiple pages — typically a skip link, and supported by proper landmarks and headings.
-
2.4.2 Page Titled
Web pages have titles that describe their topic or purpose.
-
2.4.3 Focus Order
If a page can be navigated sequentially and the order affects meaning or operation, focusable components receive focus in an order that preserves meaning and operability.
-
2.4.4 Link Purpose (In Context)
The purpose of each link can be determined from the link text alone, or from the link text together with its programmatically determined context.
-
2.4.5 Multiple Ways
More than one way is available to locate a page within a set of pages, unless the page is a step in a process.
-
2.4.6 Headings and Labels
Headings and labels describe the topic or purpose of the content they introduce.
-
2.4.7 Focus Visible
Any keyboard operable interface has a mode of operation where the keyboard focus indicator is visible.
-
2.4.8 Location
Information about the user's location within a set of pages is available — breadcrumbs, a highlighted current navigation item, or a step indicator.
-
2.4.9 Link Purpose (Link Only)
A mechanism is available to identify the purpose of each link from the link text alone, except where the purpose is ambiguous to all users.
-
2.4.10 Section Headings
Section headings are used to organise content. This applies where content divides into sections, not to every paragraph.
-
2.4.11 Focus Not Obscured (Minimum)
When a component receives keyboard focus, it is not entirely hidden by author-created content such as a sticky header, footer, or cookie banner.
-
2.4.12 Focus Not Obscured (Enhanced)
When a component receives keyboard focus, no part of it is hidden by author-created content.
-
2.4.13 Focus Appearance
The focus indicator is at least as large as a 2 CSS pixel perimeter of the focused control, and has a contrast ratio of at least 3:1 between its focused and unfocused states.
2.5 Input Modalities
-
2.5.1 Pointer Gestures
Functionality using multipoint or path-based gestures can also be operated with a single pointer without a path-based gesture, unless the gesture is essential.
-
2.5.2 Pointer Cancellation
For functionality operated by a single pointer, the action completes on the up-event, or can be aborted or undone.
-
2.5.3 Label in Name
For components with a visible text label, the accessible name contains the visible text.
-
2.5.4 Motion Actuation
Functionality operated by device motion or user motion can also be operated by interface components, and motion actuation can be disabled.
-
2.5.5 Target Size (Enhanced)
The size of the target for pointer inputs is at least 44 by 44 CSS pixels, with exceptions for inline targets, equivalents available elsewhere, and essential presentations.
-
2.5.6 Concurrent Input Mechanisms
Content does not restrict use of input modalities available on a platform, except where necessary for security or to respect user settings.
-
2.5.7 Dragging Movements
Functionality that uses a dragging movement can be achieved with a single pointer without dragging, unless dragging is essential.
-
2.5.8 Target Size (Minimum)
Targets are at least 24 by 24 CSS pixels, unless spacing, inline position, an equivalent control, or essential presentation applies. Undersized targets can pass if a 24px circle centred on each does not overlap its neighbours.
Principle 3: Understandable
Information and the operation of the user interface must be understandable. Content a user can perceive and operate is still inaccessible if they cannot comprehend it or recover from their mistakes.
3.1 Readable
-
3.1.1 Language of Page
The default human language of each page can be determined programmatically, using the lang attribute on the html element with a valid BCP 47 language tag.
-
3.1.2 Language of Parts
The human language of each passage or phrase in the content can be determined programmatically, except for proper names, technical terms, and words that have become part of the surrounding language.
-
3.1.3 Unusual Words
A mechanism is available for identifying specific definitions of words or phrases used in an unusual or restricted way, including idioms and jargon.
-
3.1.4 Abbreviations
A mechanism for identifying the expanded form or meaning of abbreviations is available.
-
3.1.5 Reading Level
Where text requires reading ability more advanced than the lower secondary education level, supplemental content or a simpler version is available.
-
3.1.6 Pronunciation
A mechanism is available for identifying specific pronunciation of words where meaning is ambiguous without it.
3.2 Predictable
-
3.2.1 On Focus
When any component receives focus, it does not initiate a change of context — no automatic form submission, navigation, new window, or focus move elsewhere.
-
3.2.2 On Input
Changing the setting of a component does not automatically cause a change of context unless the user has been advised of the behaviour beforehand.
-
3.2.3 Consistent Navigation
Navigational mechanisms repeated across multiple pages occur in the same relative order each time, unless the user changes it.
-
3.2.4 Consistent Identification
Components with the same functionality within a set of pages are identified consistently — the same label, name, and icon for the same action.
-
3.2.5 Change on Request
Changes of context are initiated only by user request, or a mechanism is available to turn off such changes.
-
3.2.6 Consistent Help
If a page includes help mechanisms — contact details, a help link, a chat widget, self-help — they appear in the same relative order on every page that has them.
3.3 Input Assistance
-
3.3.1 Error Identification
If an input error is automatically detected, the item in error is identified and the error is described to the user in text.
-
3.3.2 Labels or Instructions
Labels or instructions are provided when content requires user input, including format requirements and which fields are required.
-
3.3.3 Error Suggestion
If an input error is detected and a correction is known, the suggestion is provided to the user, unless it would jeopardise security or the purpose of the content.
-
3.3.4 Error Prevention (Legal, Financial, Data)
For pages causing legal commitments or financial transactions, modifying user-controllable data, or submitting test responses, submissions are reversible, checked and correctable, or confirmed before finalising.
-
3.3.5 Help
Context-sensitive help is available for functions requiring user input.
-
3.3.6 Error Prevention (All)
For any page requiring the user to submit information, submissions are reversible, checked and correctable, or confirmed before finalising — extending 3.3.4 to all submissions, not only consequential ones.
-
3.3.7 Redundant Entry
Information previously entered by the user in the same process is auto-populated or available to select, unless re-entry is essential, the information is security-sensitive, or the earlier value is no longer valid.
-
3.3.8 Accessible Authentication (Minimum)
A cognitive function test such as remembering a password or solving a puzzle is not required for any authentication step, unless an alternative method exists, a mechanism assists the user, or the test is object recognition or personal non-text content.
-
3.3.9 Accessible Authentication (Enhanced)
A cognitive function test is not required for any authentication step, with the object-recognition and personal-content exceptions of 3.3.8 removed.
Principle 4: Robust
Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies. This is the contract between your markup and the tools that read it.
4.1 Compatible
-
4.1.1 Parsing
Removed from WCAG 2.2. This criterion required elements to have complete start and end tags, be nested correctly, avoid duplicate attributes, and have unique IDs. It is retained here as an explainer, not as a demo, and does not count toward conformance.
-
4.1.2 Name, Role, Value
For all user interface components, the name and role can be determined programmatically; states, properties, and values can be set by the user and programmatically determined; and changes to them are notified to user agents.
-
4.1.3 Status Messages
Status messages can be programmatically determined through role or properties so they are announced by assistive technology without receiving focus.