What did WCAG 2.2 add to WCAG 2.1?

WCAG 2.2 is the current version of the Web Content Accessibility Guidelines. W3C published it as a Recommendation on 5 October 2023, and the current text is dated 12 December 2024.¹² Compared with WCAG 2.1, it adds nine success criteria and removes one. If your site already meets WCAG 2.1 AA, the work to reach 2.2 AA is six new criteria, and most of them affect things customers do every day: moving through a page with a keyboard, tapping small buttons, finding help, filling in forms and logging in.

The new criteria matter beyond the standard itself. Shopify's Theme Store already requires themes to meet the 24 by 24 pixel target size that WCAG 2.2 introduced, and WordPress expects code in its ecosystem to conform to WCAG 2.2 at level AA.⁴⁵

The nine new success criteria at a glance

Six of the nine (2.4.11, 2.5.7, 2.5.8, 3.2.6, 3.3.7 and 3.3.8) are at level A or AA, the levels most businesses aim for.¹

What each A and AA criterion means for a store

2.4.11 Focus Not Obscured (Minimum)

When someone moves through your page with the Tab key, the element they are on must not be completely covered by something you put on the page. W3C's guidance names sticky headers and footers, cookie banners and non-modal dialogs as the usual causes. Partly covered passes at AA; entirely covered fails.³ A common fix is CSS scroll-padding equal to the height of a sticky header, so the browser scrolls focused items clear of it. Content the customer opened themselves, such as a chat window, is allowed to cover focus if they can close it without moving focus back into it, for example with Escape.³

2.5.7 Dragging Movements

Price range sliders, drag-to-reorder lists, image comparison sliders and swipe-only carousels all depend on dragging. Each needs a way to do the same thing with single clicks or taps: arrow buttons on a carousel, plus and minus buttons or number fields next to a price slider.²

2.5.8 Target Size (Minimum)

Buttons and links must be at least 24 by 24 CSS pixels, unless they are spaced so that a 24 pixel circle centred on each does not overlap another target or another small target's circle, are links inside a sentence, have a same-function control on the page that meets the size, are sized by the browser and not changed by you, or a particular size is essential or legally required.² In stores, the usual failures are small colour swatches, quantity steppers, close buttons on pop-ups and footer social icons.

3.2.6 Consistent Help

If you offer help on several pages, such as a phone number, a contact link, a chat button or an FAQ link, keep it in the same order relative to the rest of the page. If the contact link sits in the footer on product pages, it should not jump to the header on the cart page. This does not require you to offer help; it requires consistency where you do.²

3.3.7 Redundant Entry

Within one process, do not make people type the same information twice. The everyday example is checkout: if the billing address is the same as the delivery address, offer a "same as delivery address" option or fill it in. Exceptions cover re-entry that is essential, needed for security (such as confirming a new password) or where the earlier information is no longer valid.²

3.3.8 Accessible Authentication (Minimum)

A login step must not require a cognitive function test, such as remembering a password or solving a puzzle, unless there is another way to log in, a mechanism that helps (W3C's examples include supporting password managers and allowing copy and paste), or the test is recognising objects or identifying images or other non-text content the person provided.² In practice: do not block paste in password or one-time code fields, let password managers fill them in, and offer email links or passkeys where your platform supports them.

What was removed: 4.1.1 Parsing

WCAG 2.2 marks 4.1.1 Parsing as obsolete and removed, with the note that it no longer has utility, because assistive technology no longer needs to parse HTML directly.² W3C says the success criteria from 2.0 and 2.1 are otherwise essentially the same in 2.2.¹ Valid HTML is still good practice, and duplicate IDs can still break labels and other relationships that other criteria cover.

How to test for the new criteria

1. Run an automated check against WCAG 2.2 A and AA. It will catch some of the measurable problems. Jralo's free check tests your homepage and up to five linked pages with axe-core, and tells you which countries' accessibility laws are likely relevant to your site, from where your business is based and where your customers are.
2. Tab through your key pages with a sticky header and any cookie banner showing. Watch for focus disappearing behind them (2.4.11).
3. Try every slider and carousel without dragging (2.5.7), and look closely at swatches, steppers and close buttons on a phone-sized window (2.5.8).
4. Compare where help appears on the home, product, cart and contact pages (3.2.6).
5. Go through checkout and login using a password manager and paste. Note anything you are asked to type twice (3.3.7, 3.3.8).

Fix what blocks people from buying or contacting you first, and keep a dated note of what you tested and changed. How to check your website in 15 minutes covers the keyboard and screen reader passes in more detail.