Tech
The Ultimate WCAG 2.2 Checklist for Developers (AA & AAA)
Sarah Dev
Lead Frontend
Read time
15 min
Published
Nov 24, 2025
WCAG (Web Content Accessibility Guidelines) is the bible of accessibility. But let's be honest—it is dense. That's why we've broken down the most critical parts of the latest version, WCAG 2.2, into a practical checklist for coders.
WCAG 2.2 does not replace 2.1; it extends it. The main focus is on users with cognitive disabilities and mobile interfaces. If you are aiming for Level AA compliance (required by most laws), here is what you need to know.
What is new in WCAG 2.2?
Version 2.2 introduced 9 new success criteria. The most impactful for standard websites are:
Focus Appearance
Removing the browser's default focus (outline: none) is a cardinal sin in accessibility unless replaced with something better. WCAG 2.2 tightens these rules.
To be safe, follow this rule of thumb:
fixed header does not overlap links when tabbing down the page (use scroll-padding-top in CSS).Target Size (Minimum)
For users with motor impairments, or just large fingers on a bumpy bus, small buttons are frustrating.
WCAG 2.5.8 (AA) requires the target size to be at least 24x24 CSS pixels. If the button is smaller, there must be enough spacing around it so the total area is 24px.
Xrayd recommends: Do not settle for 24px. Apple and Google recommend 44x44px. It is better UX for everyone. Ensure your CSS buttons have sufficient padding.
Redundant Entry
Criterion 3.3.7 concerns cognitive load. If a user has already entered their address in a previous step, do not ask them to type it again.
Solution: Implement a checkbox: 'Same as shipping address', or auto-populate the fields. This drastically reduces friction in checkout and improves conversion rates.
The code is the foundation. Use Xrayd to automatically scan your codebase for WCAG 2.2 violations.
