Web Accessibility for E-commerce Stores
How WCAG 2.1 AA applies to online stores — product pages, checkout, and cart flows — and the accessibility issues that most often surface in audits.
Last updated
Online stores live or die by how easily people can browse, choose, and pay. When a product page, filter, or checkout step is hard to use with a keyboard or a screen reader, you lose customers who would otherwise buy. Accessibility is, very practically, conversion work.
This guide is informational and reflects common patterns we see in automated and manual reviews. It is not legal advice.
Where e-commerce sites tend to struggle
- Product images without alt text. Shoppers using screen readers rely on alternative text to understand what a product looks like. "image1.jpg" tells them nothing.
- Color-only variant pickers. Swatches that communicate "out of stock" or "selected" through color alone fail WCAG 1.4.1 Use of Color.
- Inaccessible add-to-cart and quantity controls. Custom steppers and buttons frequently can't be operated by keyboard.
- Checkout forms without labels. Every input — name, address, card field — needs a programmatically associated label, not just placeholder text.
A short pre-launch checklist
- Every meaningful product image has descriptive alt text; decorative images use empty
alt="". - The full purchase flow — search, filter, add to cart, checkout — works with the keyboard alone.
- Form fields have visible labels and clear, text-based error messages.
- Interactive components expose an accessible name and role to assistive technology.
- Text and interactive elements meet the 4.5:1 (or 3:1 for large text) contrast minimum.
Why this matters commercially
Accessible stores reach more customers, reduce support load, and tend to be more robust across devices and browsers. Treat accessibility as part of quality, not a one-time audit, and bake it into how new components and templates are built.