WCAG 2.2 Compliance for Ecommerce: What Changed and What to Fix
WCAG 2.2, published in October 2023, has become the industry standard for web accessibility heading into 2025. The update adds nine new success criteria focused on mobile accessibility, cognitive accessibility, and low vision support. For ecommerce merchants, these changes require specific updates to checkout flows, interactive elements, and authentication processes.
What's New in WCAG 2.2
Nine new success criteria appear in version 2.2, all at Level A or AA. No Level AAA criteria were added. This focus reflects intent to establish achievable baseline standards.
Focus areas include mobile accessibility addressing touch target sizes and dragging interactions, cognitive accessibility reducing redundant data entry and providing consistent help, and low vision support ensuring focused elements remain visible.
Backward compatibility means sites compliant with WCAG 2.1 AA need only address new criteria to reach 2.2 AA compliance. No 2.1 criteria were removed.
New Success Criteria Relevant to Ecommerce
Success Criterion 2.4.11 Focus Not Obscured (Minimum) at Level AA requires focused elements not be completely hidden by other content. Sticky headers, modals, or chat widgets often cover focused checkout fields. The fix involves z-index management ensuring focused elements appear above other content:
/* Ensure focused element is visible */
*:focus {
position: relative;
z-index: 9999;
outline: 2px solid #005fcc;
}
Success Criterion 2.5.7 Dragging Movements at Level AA requires any dragging functionality have a single-pointer alternative. Image carousels with drag navigation must provide arrow buttons. Product sliders need alternatives. Draggable cart items need plus/minus buttons:
<!-- Bad: drag-only carousel -->
<div class="carousel" draggable="true">...</div>
<!-- Good: drag + button alternatives -->
<div class="carousel" draggable="true">
<button aria-label="Previous">←</button>
<button aria-label="Next">→</button>
</div>
Success Criterion 2.5.8 Target Size (Minimum) at Level AA specifies clickable targets must be at least 24 by 24 CSS pixels. Small close buttons on modals, tiny product swatches, and mobile navigation icons frequently violate this:
/* Minimum target size */
button, a, input[type="checkbox"] {
min-width: 24px;
min-height: 24px;
padding: 8px; /* effective target larger than 24px */
}
Success Criterion 3.2.6 Consistent Help at Level A requires that if help mechanisms appear on multiple pages, they must be in consistent locations. Chat widgets that move based on page layout or help links in different positions violate this. The fix standardizes help mechanism placement across the site.
Success Criterion 3.3.7 Redundant Entry at Level A prevents asking users to enter the same information multiple times. Checkout flows requesting shipping then billing address without copy option violate this:
<label>
<input type="checkbox" id="sameAsShipping">
Billing address same as shipping
</label>
Success Criterion 3.3.8 Accessible Authentication (Minimum) at Level AA requires authentication not rely solely on cognitive function tests like memorizing passwords or solving puzzles. CAPTCHA challenges on checkout and complex password requirements create barriers. Fixes include email magic links, biometric authentication, password managers, or Google reCAPTCHA v3 that assesses risk without user interaction.
Regulatory Landscape in 2025
ADA Title III in the United States currently references WCAG 2.1 Level AA in most guidance and court settlements. However, WCAG 2.2 adoption is accelerating. Forward-looking merchants should target 2.2 compliance.
European Accessibility Act becomes effective June 28, 2025, requiring WCAG 2.1 Level AA compliance for ecommerce in EU. While EAA references 2.1, merchants should consider implementing 2.2 proactively.
Canada's Accessible Canada Act requires WCAG 2.1 Level AA for federally regulated entities. Provincial legislation varies.
Litigation trends show over 5,000 web accessibility lawsuits filed in US courts during 2024, primarily targeting ecommerce sites. Plaintiffs' attorneys increasingly cite specific WCAG violations. Proactive compliance reduces litigation risk substantially.
How to Implement WCAG 2.2
Audit current site against WCAG 2.2 criteria using both automated and manual testing. Automated tools like axe DevTools, WAVE, or Lighthouse catch technical violations. However, automated tools catch only 30 to 40 percent of issues. Manual testing with keyboard navigation verifies focus management. Screen reader testing with NVDA, JAWS, or VoiceOver reveals assistive technology experience.
Prioritize Level A and AA criteria as baseline requirements. Level AAA criteria are aspirational except for specific contexts.
Focus on new 2.2 criteria first if already compliant with 2.1. Sites not previously compliant should address all A and AA criteria comprehensively.
Test with real users including people with disabilities whenever possible. Organizations like Access Works facilitate user testing with disabled testers.
Document compliance through Voluntary Product Accessibility Template (VPAT) for enterprise customers. Maintain accessibility statement on the site explaining conformance level, known issues, and contact information.
Shopify-Specific Considerations
Theme compliance requires testing against WCAG 2.2. Many popular themes achieve good accessibility out of the box, but customizations often introduce violations. Newer themes generally perform better.
App compliance represents a challenge because third-party apps can introduce violations. Review widgets, popups, and integrations for accessibility. Choose apps with documented accessibility commitments where possible.
Checkout customizations for Shopify Plus merchants must maintain accessibility. Custom checkout blocks should follow Shopify's UI components which provide accessible defaults. The checkout represents the most critical conversion point.
Tools available include Shopify's built-in accessibility features like semantic HTML and keyboard navigation support. Accessible Shopify themes certified through audits provide confidence. Manual remediation is more reliable than automated overlay solutions.
Conclusion
WCAG 2.2 raises accessibility requirements modestly through nine new success criteria focused on mobile, cognitive, and low vision concerns. For ecommerce sites, key updates affect focus visibility, touch targets, dragging alternatives, consistent help placement, redundant data entry, and authentication methods. These changes are achievable through systematic audit and remediation. The regulatory and litigation landscape in 2025 makes compliance a risk management priority beyond the social value of inclusive design. Investment in accessibility compliance protects against litigation while expanding addressable market to include disabled users who represent significant purchasing power. The combination of risk mitigation and market expansion justifies the relatively modest implementation cost.
Related Articles
Why Accessibility Matters for Ecommerce: The Business Case Beyond Compliance
The business case for web accessibility in ecommerce, covering market reach, legal compliance, and UX benefits.
Accessibility as a Competitive Advantage for Shopify Apps
How prioritizing accessibility can help Shopify apps win more installs from compliance-conscious merchants and enterprise customers.
Common Accessibility Failures in Shopify Themes and Apps
Specific WCAG violations frequently found in Shopify stores: missing alt text, poor color contrast, keyboard navigation issues, and form labels.