WCAG 2.2: The 9 New Success Criteria Every Frontend Engineer Should Know

The Web Content Accessibility Guidelines (WCAG) 2.2 introduce 9 new success criteria designed to assist users with motor impairments, low vision, and cognitive disabilities, as well as mobile device users.

Here is what developers need to know when upgrading to WCAG 2.2 Level AA.

---

1. Focus Not Obscured (Minimum) (2.4.11 - Level AA)

When an interactive component receives keyboard focus, it must not be completely hidden beneath sticky headers, persistent cookie banners, or floating chat widgets.

/* Ensure proper scroll padding for fixed navigation bars */
html {
  scroll-padding-top: 80px;
}

---

2. Target Size (Minimum) (2.5.8 - Level AA)

Pointer targets must have an interactive area of at least 24 by 24 CSS pixels, or sufficient spacing from neighboring interactive elements.

• Prevents accidental misclicks on touch screens.
• Directly impacts social media footer icons and compact X close buttons.

---

3. Accessible Authentication (Minimum) (3.3.8 - Level AA)

Cognitive function tests (such as memorizing complex strings or deciphering distorted CAPTCHAs) cannot be mandatory during authentication.

Permitted solutions:

• Password manager autofill (autocomplete="current-password")
• Magic login links via email
• Passkeys & WebAuthn biometrics
• Copy-and-paste support in credentials fields

---

Conclusion

Automate these checks directly in your pull requests using Wabiy CLI to catch WCAG 2.2 regressions before code merges into production.