E-commerce is one of the most heavily targeted industries for accessibility lawsuits. In 2025 alone, over 4,000 ADA-related lawsuits were filed against online retailers in the United States. With the European Accessibility Act (EAA) now in full effect as of June 2025, online stores selling to EU customers face additional legal obligations. Beyond legal risk, inaccessible e-commerce sites lose revenue—an estimated 1.3 billion people worldwide live with some form of disability, representing over $13 trillion in annual disposable income. Common barriers include inaccessible product filters, checkout forms that cannot be completed with a keyboard, missing alt text on product images, and color contrast issues that make pricing and promotional information unreadable. This guide covers the specific legal requirements, most common accessibility failures in e-commerce, and a practical compliance checklist to protect your business and expand your customer base.

Legal Requirements

Key Accessibility Issues in E-commerce

Inaccessible Product Filtering and Sorting

Product filters often rely on custom JavaScript widgets (sliders, expandable facets, drag-and-drop) that are not operable with a keyboard or announced by screen readers. Users who rely on assistive technology cannot narrow product listings.

How to fix:

Use native HTML elements where possible. For custom widgets, implement ARIA roles (e.g., role='listbox', role='slider'), manage focus, and ensure all interactions are operable via keyboard. Test with screen readers like NVDA and VoiceOver.

Missing or Decorative Alt Text on Product Images

Product images frequently have empty alt attributes, generic text like 'image1.jpg', or alt text that does not describe the product. Screen reader users cannot understand what the product looks like or differentiate between variants.

How to fix:

Write descriptive alt text that includes the product name, key visual attributes (color, style, size), and any text visible in the image. For lifestyle/decorative images, use alt='' but ensure at least one image per product has a full description.

Checkout Flow Keyboard Traps and Form Errors

Multi-step checkout processes often trap keyboard focus in modal overlays, fail to announce validation errors, or lose focus when moving between steps. Users who cannot use a mouse are unable to complete purchases.

How to fix:

Ensure logical tab order through all checkout steps. Announce form errors with aria-live regions or by moving focus to the first error. Avoid modal traps by providing a visible, keyboard-accessible close mechanism. Test the entire checkout flow using only a keyboard.

Insufficient Color Contrast on Prices and CTAs

Sale prices, discount badges, and call-to-action buttons frequently fail WCAG 2.1 contrast ratios (4.5:1 for normal text, 3:1 for large text). Users with low vision or color blindness cannot distinguish prices or find the 'Add to Cart' button.

How to fix:

Audit all text elements with a contrast checker (e.g., axe DevTools, Colour Contrast Analyser). Ensure sale/original price distinctions do not rely solely on color—add labels like 'Was' and 'Now'. Maintain minimum 4.5:1 contrast on all interactive elements.

Inaccessible Cart and Quantity Selectors

Custom quantity inputs, remove-item buttons, and cart summary updates often fail to communicate changes to assistive technology. Screen reader users may not know their cart updated after clicking a button.

How to fix:

Use aria-live='polite' regions to announce cart updates (e.g., 'Item removed. Cart total: $45.00'). Ensure quantity inputs have visible labels and are keyboard-operable. Provide confirmation when actions complete.

Compliance Checklist

  • All product images have descriptive alt text that includes the product name and key visual details
  • The entire checkout flow can be completed using only a keyboard with no focus traps
  • Form validation errors are announced to screen readers and focus moves to the first error
  • Color contrast meets WCAG 2.1 AA minimums (4.5:1 for text, 3:1 for large text and UI components)
  • Product filters and sorting controls are operable via keyboard and announced by screen readers
  • Cart updates are communicated via aria-live regions so assistive technology users are notified of changes
  • All interactive elements (buttons, links, inputs) have accessible names that describe their purpose
  • Video product demos have captions and audio descriptions where visual content is critical
  • Cookie consent banners and promotional popups are keyboard-accessible with a clear dismiss mechanism
  • The site maintains a published accessibility statement with contact information for reporting issues

Further Reading

Other Industry Guides