Shopify Accessibility: How to Make Your Store Usable for Everyone

An accessible Shopify store is one that people can use with a keyboard, a screen reader, zoomed-in text, voice control or reduced color vision. It's partly a legal question, but mostly a sales question: every shopper who can't find the size selector, read a low-contrast price or get past a pop-up is an order you lose.

The good news is that Shopify gives you a solid starting point. Shopify's checkout is tested against WCAG 2.2 Level AA, and themes in the Shopify Theme Store have to meet accessibility requirements before they're listed. The bad news is that most accessibility problems are introduced after launch, by content, customizations and apps. Missing alt text, low-contrast brand colors, auto-rotating carousels and inaccessible app widgets are the usual suspects.

This guide explains what Shopify covers, where stores typically fail, how to test, why overlay widgets aren't a shortcut, and the US and EU legal context, cited from official sources. It's general information, not legal advice. For other guides in this series, visit the Shopify hub.

What Shopify already covers

Shopify's accessibility statement says it "continually test[s] content and features for WCAG 2.2 Level AA compliance." It publishes accessibility conformance reports in the VPAT (Voluntary Product Accessibility Template) format. As of October 2026, the statement lists the checkout against WCAG 2.2 A/AA, and the admin and the Dawn theme against WCAG 2.1 A/AA. You can contact Shopify's accessibility team at accessibility@shopify.com.

That matters because checkout is the one part of a standard Shopify store you can't rebuild from scratch. On non-Plus plans, the Information, Shipping and Payment steps can't be customized with checkout UI extensions at all, and Plus stores customize them through Shopify's extension framework rather than raw HTML. The trade-off is less design freedom, but you inherit Shopify's accessibility work. Our guide to Shopify checkout extensibility covers what you can change.

Theme Store requirements

Themes sold in the Shopify Theme Store must meet Shopify's theme requirements, which include:

• A minimum average Lighthouse accessibility score of 90 across the home, product and collection pages, on desktop and mobile.
• Keyboard access to every part of the page, "including dropdown navigation," with a visible focus state on focusable elements.
• Focus order that matches the page order (top to bottom, left to right).
• Text contrast of 4.5:1 for body content, and 3:1 for large text and non-text elements such as borders and icons.
• An alt attribute on all images, properly labeled form inputs and valid HTML.
• Touch targets of at least 24 by 24 CSS pixels.

A passing theme is a good foundation, not a guarantee. Lighthouse checks only what can be tested automatically, and the score applies to the theme's demo content, not your logo colors, images, apps and custom sections. If you're choosing a theme, our Shopify themes guide covers what else to compare.

The most common accessibility failures on Shopify stores

1. Missing or useless alt text

Shopify lets you add alt text to every product image and most theme images. Shopify's theme best practices say product and content images should have alt text "which describes the image for screen reader users," and decorative images should use an empty alt value. Write what a shopper needs to know: "Navy linen shirt, front view, buttoned collar," not "IMG_4021" or a keyword list. If a variant changes the image, make sure the alt text describes that variant.

2. Brand colors that fail contrast

Light gray text on white, white text on pastel buttons and text over hero images are the most frequent contrast failures. Check your theme's color settings against the 4.5:1 ratio for normal text and 3:1 for large text and icons. For text on images, add an overlay or a solid background behind the text.

3. Invisible or removed focus states

Some customizations remove the focus outline because a designer found it ugly. Keyboard users then can't tell where they are on the page. Keep a clearly visible focus style on links, buttons, form fields, swatches and menu items.

4. Auto-playing carousels and video

Shopify's theme accessibility best practices say content that plays automatically in a slideshow should be able to be paused or stopped, and media shouldn't autoplay (if it must, the sound should be muted). Rotating hero banners also tend to hide your second and third messages from most visitors. A single static hero is often better for accessibility and conversion.

5. Variant pickers and custom swatches

Color swatches built as unlabeled images or divs can be impossible to use with a screen reader. Each option should have a text label ("Color: Forest green"), a clear selected state that doesn't rely on color alone, and keyboard support. Products with many variants (Shopify allows up to 2,048 per product since October 2025) make this even more important.

6. Pop-ups, drawers and app widgets

Email sign-up pop-ups, cart drawers, chat widgets, review carousels and quiz apps are frequent problem areas because they're built by third parties. Common issues: focus doesn't move into the pop-up, the close button isn't labeled or reachable by keyboard, and focus isn't returned when it closes. Test every app widget with a keyboard before you keep it, and ask vendors for their accessibility documentation. Our Shopify App Store guide covers how to vet apps more broadly.

7. Forms and error messages

Contact forms, newsletter forms and custom product inputs (engraving text, file uploads) need visible labels, not just placeholder text, and error messages that explain what went wrong in text, not only with a red border.

8. Content structure

Use one H1 per page, headings in order, descriptive link text ("View size guide," not "Click here") and real text instead of text baked into images. Product descriptions with clear headings and lists are easier for screen reader users, and also for search engines and AI assistants.

How to test your store

Automated tools catch only part of the picture, so combine them with a short manual check.

Run the keyboard and screen reader tests on your home page, a collection page, a product page with variants, the cart and the first checkout step. Repeat after every theme update or new app install.

Why overlay widgets aren't a fix

Accessibility overlays are scripts that add a toolbar or claim to repair a site automatically with AI. They're tempting because they're cheap and quick. But they can't fix the underlying code, content or app behavior, and many assistive technology users already have their own settings.

Regulators have noticed the marketing. In January 2025 the US Federal Trade Commission announced an order requiring accessiBe to pay $1 million over claims that its AI-powered tool could make any website compliant with WCAG, and it approved the final order in April 2025. The order bars the company from claiming its automated products can make any website WCAG-compliant unless it has evidence to support the claim. If a vendor promises instant compliance or lawsuit protection, treat it as a red flag and fix the store itself.

The legal context (not legal advice)

United States: the ADA

Title III of the Americans with Disabilities Act covers businesses open to the public. The Department of Justice's guidance on web accessibility (18 March 2022) says that "A website with inaccessible features can limit the ability of people with disabilities to access a public accommodation's goods, services, and privileges available through that website." It also says the Department "does not have a regulation setting out detailed standards" for businesses, points to WCAG as helpful guidance, and says businesses "can currently choose how they will ensure" accessibility.

In April 2024 the DOJ published a web accessibility rule for state and local governments under Title II. That rule applies to public entities, not private online stores, and the ADA.gov guidance page notes that it doesn't reflect those Title II requirements.

In practice, website accessibility claims against online retailers are often brought by private plaintiffs, and state laws can add their own requirements. Our article on ADA website lawsuits in 2026 covers the litigation side. If you receive a demand letter, talk to a lawyer before you reply.

European Union: the European Accessibility Act

The European Accessibility Act (Directive (EU) 2019/882) applies from 28 June 2025, and e-commerce is among the services it covers. The EU's official summary notes that it doesn't apply to micro-enterprises providing services. Each member state enforces it through national law, so if you sell to EU consumers, check the rules in your main markets with local counsel.

Which standard to aim for

WCAG 2.2 Level AA is the most practical target. It's the level Shopify tests its checkout against, it builds on WCAG 2.1 (so meeting 2.2 AA generally covers 2.1 AA as well), and it's the standard most accessibility audits use.

A practical accessibility plan

1. Audit: run an automated scan and the keyboard test on your five key templates.
2. Fix content first: alt text, heading order, link text and color contrast. These need no developer.
3. Fix theme issues: focus styles, carousels, swatches and forms. Do this in a duplicate theme so you don't break the live store; our guide on customizing a theme safely explains the workflow.
4. Review apps: test each storefront app with a keyboard and screen reader; replace or remove the worst offenders.
5. Publish an accessibility statement: say what standard you aim for, known issues and how customers can get help or report a problem.
6. Repeat: re-test after theme updates, new apps and seasonal redesigns.

Conclusion

Shopify handles much of the hard work in checkout and gives Theme Store themes a tested baseline. Most accessibility problems on Shopify stores come from what's added later: images without alt text, brand colors, carousels and third-party widgets. Fix those with real testing rather than an overlay, aim for WCAG 2.2 AA, and keep a simple statement and contact route for customers who hit a barrier. If you want an accessibility review or theme fixes, eSEOspace provides Shopify development services.

Frequently asked questions