WCAG 2.1 vs WCAG 2.2: What's New and What You Need to Update

The Web Content Accessibility Guidelines (WCAG) 2.2 became the official W3C recommendation in October 2023, bringing important updates to web accessibility standards. If your website is currently WCAG 2.1 compliant, here's what you need to know about upgrading to WCAG 2.2.

Understanding WCAG Versions

WCAG 2.0 (2008)

The foundation of modern web accessibility, introducing the four principles: Perceivable, Operable, Understandable, and Robust (POUR).

WCAG 2.1 (2018)

Added 17 new success criteria focusing on mobile accessibility, low vision, and cognitive disabilities.

WCAG 2.2 (2023)

Adds 9 new success criteria and removes 1, focusing on mobile interactions, cognitive accessibility, and user authentication.

The 9 New Success Criteria in WCAG 2.2

1. Focus Not Obscured (Minimum) - Level AA

What it means: When a user interface component receives keyboard focus, it must not be entirely hidden by author-created content.

Why it matters: Users navigating by keyboard need to see where focus is at all times.

How to comply:

• Ensure sticky headers don't cover focused elements
• Check modal dialogs don't obscure focus indicators
• Test dropdown menus with keyboard navigation

2. Focus Not Obscured (Enhanced) - Level AAA

What it means: When a component receives focus, no part of it should be hidden by author-created content.

Why it matters: Provides better visibility for keyboard users.

How to comply:

• Implement smart scrolling that adjusts for fixed elements
• Use z-index carefully to avoid obscuring focus
• Test with browser zoom at 200%

3. Focus Appearance - Level AAA

What it means: Focus indicators must have sufficient contrast and size.

Why it matters: Users with low vision need clear visual indication of focus.

How to comply:

• Focus indicator must be at least 2 CSS pixels thick
• Contrast ratio of at least 3:1 against adjacent colors
• Ensure focus indicator is visible on all interactive elements

4. Dragging Movements - Level AA

What it means: Functionality that requires dragging must have a single-pointer alternative.

Why it matters: Users with motor disabilities may not be able to perform dragging motions.

How to comply:

• Provide buttons for reordering lists instead of drag-and-drop only
• Offer click-to-select alternatives for sliders
• Include keyboard shortcuts for draggable interfaces

5. Target Size (Minimum) - Level AA

What it means: Interactive targets must be at least 24×24 CSS pixels, with some exceptions.

Why it matters: Smaller targets are difficult for users with motor disabilities or on touch devices.

How to comply:

• Make buttons and links at least 24×24 pixels
• Add sufficient padding around clickable elements
• Ensure adequate spacing between interactive elements

6. Consistent Help - Level A

What it means: If help mechanisms appear on multiple pages, they must appear in the same relative order.

Why it matters: Users with cognitive disabilities benefit from predictable help locations.

How to comply:

• Keep help links in consistent positions (e.g., always top-right)
• Maintain same order for contact info, FAQs, chatbots
• Use consistent labels for help mechanisms

7. Redundant Entry - Level A

What it means: Information previously entered by the user should not need to be entered again in the same process.

Why it matters: Reduces cognitive load and errors, especially for users with memory or cognitive disabilities.

How to comply:

• Auto-fill shipping address from billing address
• Remember user selections in multi-step forms
• Provide "same as above" options
• Use browser autocomplete attributes

8. Accessible Authentication (Minimum) - Level AA

What it means: Cognitive function tests (like remembering passwords or solving puzzles) must not be required for authentication.

Why it matters: Users with cognitive disabilities struggle with complex authentication.

How to comply:

• Support password managers (don't block paste)
• Offer email magic links or SMS codes
• Provide biometric authentication options
• Allow copy-paste for verification codes
• Don't use CAPTCHAs that require cognitive tests

9. Accessible Authentication (Enhanced) - Level AAA

What it means: No cognitive function test is required for any step in authentication.

Why it matters: Provides maximum accessibility for users with cognitive disabilities.

How to comply:

• Implement passwordless authentication
• Use device-based authentication
• Offer biometric options
• Support security keys

Removed Criterion

4.1.1 Parsing - Removed

This criterion required valid HTML markup but was removed because modern browsers handle invalid HTML better, and HTML validation is covered by other criteria.

What this means for you: You can still have valid HTML (recommended), but it's no longer a WCAG requirement.

Impact by Conformance Level

Level A (Minimum)

• 2 new criteria (Consistent Help, Redundant Entry)
• Essential for basic accessibility

Level AA (Standard)

• 4 new criteria (Focus Not Obscured Minimum, Dragging Movements, Target Size Minimum, Accessible Authentication Minimum)
• Most organizations target this level

Level AAA (Enhanced)

• 3 new criteria (Focus Not Obscured Enhanced, Focus Appearance, Accessible Authentication Enhanced)
• Gold standard for accessibility

Migration Checklist: WCAG 2.1 to 2.2

Immediate Actions (High Priority)

• Audit draggable interfaces for single-pointer alternatives
• Check all interactive elements meet 24×24 pixel minimum
• Review authentication flows for cognitive function tests
• Test keyboard focus visibility across the site

Short-term Actions (1-3 Months)

• Implement redundant entry prevention in forms
• Standardize help mechanism locations
• Add password manager support
• Update accessibility statement to reference WCAG 2.2

Long-term Actions (3-6 Months)

• Enhance focus indicators to meet new standards
• Implement passwordless authentication options
• Conduct user testing with people with disabilities
• Train development team on WCAG 2.2 requirements

Tools for WCAG 2.2 Testing

Automated Testing

• axe DevTools: Updated for WCAG 2.2 criteria
• WAVE: Includes WCAG 2.2 checks
• Lighthouse: Google's accessibility auditor

Manual Testing

• Keyboard Navigation: Tab through entire site
• Screen Readers: NVDA (Windows), JAWS (Windows), VoiceOver (Mac/iOS)
• Browser Zoom: Test at 200% zoom level
• Touch Target Testing: Use mobile devices or browser dev tools

Industry Adoption Timeline

• October 2023: WCAG 2.2 becomes W3C recommendation
• 2024: Early adopters begin implementation
• 2025: Major organizations update policies
• 2026: WCAG 2.2 becomes standard requirement
• 2027+: Legal precedents establish WCAG 2.2 as compliance standard

Backward Compatibility

Good news: WCAG 2.2 is backward compatible with WCAG 2.1. If you meet WCAG 2.2, you automatically meet WCAG 2.1. However, the reverse is not true—WCAG 2.1 compliance does not guarantee WCAG 2.2 compliance.

Cost Implications

Small Websites (10-50 pages)

• Audit: $500 - $1,500
• Remediation: $1,000 - $3,000
• Total: $1,500 - $4,500

Medium Websites (50-200 pages)

• Audit: $1,500 - $5,000
• Remediation: $3,000 - $10,000
• Total: $4,500 - $15,000

Large Websites (200+ pages)

• Audit: $5,000 - $15,000
• Remediation: $10,000 - $50,000+
• Total: $15,000 - $65,000+

Common Questions

Q: Do I need to update if I'm already WCAG 2.1 AA compliant? A: Yes, eventually. While WCAG 2.1 is still valid, WCAG 2.2 is the current standard and will become the legal requirement.

Q: When will WCAG 2.2 be legally required? A: It varies by jurisdiction. EU regulations are expected to reference WCAG 2.2 by 2027. US courts are already citing WCAG 2.2 in some cases.

Q: Can I skip WCAG 2.1 and go straight to 2.2? A: Yes! WCAG 2.2 includes all WCAG 2.1 requirements plus the new criteria.

Q: What about WCAG 3.0? A: WCAG 3.0 is still in development and won't be finalized until at least 2027-2028. Focus on WCAG 2.2 for now.

Conclusion

WCAG 2.2 represents an important evolution in web accessibility standards, with a stronger focus on mobile accessibility, cognitive disabilities, and modern authentication methods. While the update adds 9 new success criteria, most are achievable with thoughtful design and development practices.

Ready to upgrade to WCAG 2.2? Start with an accessibility audit to identify gaps and create a prioritized remediation plan.