Non-text Content
Every image, icon, and non-text element has a text alternative. Decorative ones are explicitly marked as such (alt="").
How to test: Automated (axe-core catches missing alts). Manual review for meaningful alt text.
20 min read·Accessibility·
The WCAG 2.2 Compliance Checklist (A, AA, AAA)
A practical WCAG 2.2 compliance checklist organized by level (A, AA, AAA) and principle (perceivable, operable, understandable, robust). Includes every success criterion, what it means in plain English, and how to test it.
31
Level A
24
Level AA
3
Level AAA
9
New in 2.2
WCAG 2.2 is the current W3C recommendation for web accessibility (published October 2023), adding nine success criteria on top of WCAG 2.1. It's the de-facto standard US and EU regulators reference - Section 508 aligns with it, the European Accessibility Act effectively requires it by 2025, and ADA lawsuits lean on it even in jurisdictions where it's not codified.
Below is every success criterion in plain English, organized by the four WCAG principles, with a note on how to test each one. Level A is the floor.Level AA is what most laws require and what most procurement teams demand. Level AAA is aspirational - you don't need to hit it globally, but specific pages can.
Items flagged NEW in 2.2 are the nine added in the 2.2 update. If your last audit was against 2.1, these are the new ones to review.
perceivable
Users must be able to perceive the information: text alternatives, captions, contrast, adaptable content.
Audio-only and Video-only (Prerecorded)
Prerecorded audio has a transcript; prerecorded video without audio has a text or audio alternative.
How to test: Manual - tooling can't evaluate transcript quality.
Captions (Prerecorded)
Prerecorded videos with audio have captions.
How to test: Manual - confirm captions exist and are accurate.
Audio Description or Media Alternative
Prerecorded video has either audio description or a text alternative that describes what happens visually.
How to test: Manual.
Captions (Live)
Live audio content has captions.
How to test: Manual - sample live streams.
Audio Description (Prerecorded)
Audio description is provided for all prerecorded video.
How to test: Manual.
Info and Relationships
Semantic markup conveys structure: headings are <h*>, lists are <ul>/<ol>, tables have <th>, form fields have labels.
How to test: Automated catches most. Manual review for custom components.
Meaningful Sequence
The DOM reading order matches the visual reading order.
How to test: Manual with screen reader + CSS disabled preview.
Sensory Characteristics
Instructions don't rely on shape, size, location, or sound alone ("click the green button on the right" is not enough).
How to test: Manual content review.
Orientation
Content doesn't force portrait-only or landscape-only orientation, unless essential.
How to test: Manual - rotate device.
Identify Input Purpose
Form inputs that collect user info have autocomplete attributes matching their purpose.
How to test: Automated (axe-core checks autocomplete coverage).
Use of Color
Color isn't the only way to convey information (error states, links, required fields).
How to test: Manual review + color-blind simulation.
Audio Control
Audio that plays for more than 3 seconds can be paused or muted.
How to test: Manual.
Contrast (Minimum)
Text has a 4.5:1 contrast ratio against background (3:1 for large text).
How to test: Automated - OnChange computes this for every scanned page.
Resize Text
Text can be resized to 200% without loss of content or functionality.
How to test: Manual - browser zoom.
Images of Text
Don't use images of text unless essential (logos are fine).
How to test: Manual audit of image assets.
Reflow
Content reflows at 320 CSS pixels wide without horizontal scrolling (except for tables, maps, data viz).
How to test: Manual - responsive testing.
Non-text Contrast
UI components and graphical objects have 3:1 contrast against adjacent colors.
How to test: Automated (axe-core covers most; some custom UI needs manual checks).
Text Spacing
Users can override line-height, paragraph spacing, letter-spacing, and word-spacing without breaking the layout.
How to test: Manual - override via dev tools.
Content on Hover or Focus
Tooltips and popovers triggered by hover/focus can be dismissed, remain visible until dismissed, and stay visible when pointer moves onto them.
How to test: Manual interaction testing.
operable
Users must be able to operate the interface: keyboard, timing, navigation, input modalities.
Keyboard
All functionality is reachable and operable from a keyboard alone.
How to test: Manual - tab through the page, no mouse.
No Keyboard Trap
Keyboard focus can move away from any component.
How to test: Manual.
Character Key Shortcuts
Single-character keyboard shortcuts can be turned off, remapped, or are only active when focus is on a specific component.
How to test: Manual.
Timing Adjustable
Time limits can be turned off, adjusted, or extended.
How to test: Manual for timed content.
Pause, Stop, Hide
Auto-playing, moving, or blinking content that starts on page load can be paused, stopped, or hidden.
How to test: Manual audit of carousels, animations.
Three Flashes or Below
Nothing flashes more than 3 times per second.
How to test: Manual with flashing-content checker.
Bypass Blocks
A "skip to content" link or equivalent is available so keyboard users can skip repeated navigation.
How to test: Manual - first tab press should reveal the skip link.
Page Titled
Every page has a descriptive <title>.
How to test: Automated.
Focus Order
Tab order through interactive elements is logical and meaningful.
How to test: Manual keyboard walkthrough.
Link Purpose (In Context)
Link text (or its surrounding context) describes where it goes. Avoid "click here".
How to test: Manual review of link list via screen reader.
Multiple Ways
Users can find content via multiple paths: navigation, search, sitemap.
How to test: Manual site review.
Headings and Labels
Headings and labels describe their topic or purpose.
How to test: Manual - skim the heading outline and form labels.
Focus Visible
Keyboard focus indicator is clearly visible on every interactive element.
How to test: Manual keyboard test.
Focus Not Obscured (Minimum)
The focused element isn't entirely hidden by sticky headers, cookie banners, or other fixed overlays.
How to test: Manual keyboard test with sticky UI visible.
Focus Not Obscured (Enhanced)
Stricter version of 2.4.11: no part of the focused element is obscured.
How to test: Manual.
Focus Appearance
Focus indicator is at least as large as a 2px thick border around the element and has 3:1 contrast against the unfocused state.
How to test: Manual measurement with dev tools.
Pointer Gestures
Functions that use multi-point or path-based gestures (pinch, swipe) have single-pointer alternatives.
How to test: Manual.
Pointer Cancellation
Mouse/touch actions fire on mouseup (not mousedown), so users can abort by moving off.
How to test: Manual.
Label in Name
Accessible name of a UI component includes its visible label text.
How to test: Automated (axe-core catches most mismatches).
Motion Actuation
Functionality triggered by device motion (shaking, tilting) has a conventional input alternative and can be disabled.
How to test: Manual if motion is used.
Dragging Movements
Any functionality using a dragging movement has a single-pointer alternative that doesn't require dragging.
How to test: Manual.
Target Size (Minimum)
Interactive targets are at least 24×24 CSS pixels, with exceptions for inline text links and essential sizing.
How to test: Automated / manual measurement.
understandable
Content and operation must be understandable: readable, predictable, input assistance.
Language of Page
The page's primary language is set via <html lang="…">.
How to test: Automated.
Language of Parts
Parts of the page in a different language are marked with lang attributes.
How to test: Manual.
On Focus
Moving focus to an element doesn't trigger unexpected context changes (no navigating away, no form submission).
How to test: Manual.
On Input
Changing a form input's value doesn't trigger a context change unless the user was warned.
How to test: Manual.
Consistent Navigation
Repeated navigation appears in the same relative order across pages.
How to test: Manual site audit.
Consistent Identification
Components with the same function across pages are identified consistently (same icon, same label).
How to test: Manual site audit.
Consistent Help
If help is available (chat, contact link, FAQ), it's in the same relative location across pages.
How to test: Manual.
Error Identification
Form errors are identified and described in text.
How to test: Manual form testing.
Labels or Instructions
Form inputs have labels or instructions.
How to test: Automated (axe-core catches missing labels).
Error Suggestion
Error messages suggest how to fix the problem.
How to test: Manual.
Error Prevention (Legal, Financial, Data)
For pages handling legal, financial, or user data: allow reversal, review, or confirmation before submission.
How to test: Manual.
Redundant Entry
Don't ask users to re-enter information they already provided in the same process, unless essential.
How to test: Manual flow review.
Accessible Authentication (Minimum)
Auth doesn't rely on solving cognitive puzzles unless an alternative is offered (biometric, password manager paste, magic link).
How to test: Manual.
Accessible Authentication (Enhanced)
Stricter version of 3.3.8 - no cognitive puzzles at all.
How to test: Manual.
robust
Content must work across assistive technologies, now and in the future.
Name, Role, Value
Every UI component has a programmatically determinable name, role, and value. ARIA or native semantics.
How to test: Automated + manual screen reader testing.
Status Messages
Status messages (success, error, loading) are announced to assistive tech without moving focus.
How to test: Manual screen reader testing.
How OnChange helps with WCAG 2.2
Most of the automatable criteria above map directly to axe-core rules, which OnChange runs inside a real headless Chromium on every accessibility scan. Contrast ratios (1.4.3 / 1.4.11), missing labels (3.3.2), missing alt text (1.1.1), language attributes (3.1.1), and keyboard-reachable interactive elements (2.1.1) are all automatic.
- Run on-demand WCAG scans; diff results against an attested baseline so regressions are obvious.
- Auto-scan on every detected change - a marketing tweak that breaks contrast gets caught on the next check.
- Every scan produces a branded print-ready report at /audit/:id - hand it to clients or procurement directly.
- AI-generated summary categorizes new violations by WCAG criterion so you know which pages need human attention first.
Related reading
Run your first scan free
OnChange's Free plan includes the full WCAG scanner, attested baselines, and branded reports.
Start free