All guides
CMS guide · CMS / Platform

Accessibility for Shopify stores.

Shopify retailers face more ADA Title III demand letters than any other e-commerce platform — the platform is great for shipping fast, less great at default accessibility. The audit workflow tuned for Shopify themes and apps.

Recurring issues

What goes wrong in Shopify projects.

01

Theme image alt text from bulk imports

Product images imported in bulk (CSV, Shopify product transfer, dropshipping) often arrive with empty alt or `alt="product-image-1"`. Every product page is a WCAG 1.1.1 failure waiting for a demand letter.

02

Color contrast in theme settings

Most Shopify themes have customizable color schemes. Defaults are often accessible; merchant customization frequently breaks WCAG 1.4.3 (light gray on white, brand color text fails 4.5:1).

03

Mega-menu keyboard traps

Custom mega-menus with hover-only behavior trap keyboard users on the parent link. Many Shopify theme menus exhibit this. The fix needs both keyboard handlers and proper ARIA.

04

Cart drawer focus management

Cart drawer slide-outs (very common on Shopify) often fail to trap focus inside the drawer, fail to return focus on close, or contain a button that fires on `mousedown` not `click`.

05

Quick-view modals on collection pages

Modal popups for product quick-view are accessibility hot spots: focus order, escape-to-close, return focus to trigger. Most theme implementations get at least one wrong.

06

Inaccessible apps injected via theme blocks

Apps that inject reviews widgets, size charts, or upsell popups via theme blocks can introduce accessibility failures site-wide. Audit the rendered storefront, not just the theme codebase.

Recommended tooling

The Shopify accessibility stack we recommend.

Shopify Dawn theme (and modern Online Store 2.0 themes)

Dawn is Shopify's reference theme — strong accessibility baseline (skip links, semantic markup, focus management for cart drawer). Most modern themes derived from Dawn inherit much of this.

Shopify Accessibility Hub

Official Shopify documentation for merchants and theme developers. Pattern recommendations for cart, checkout, search.

AccessProof (external continuous scan)

Scans your live storefront. No theme app install, no Liquid edits. Catches issues from the merchant view (apps loaded, customer data, cart state). Free plan covers 1 site monthly; Pro covers 25 sites for agencies.

axe DevTools browser extension

Use during theme development. Catches issues at the template level before they hit production.

Theme Inspector for Chrome

Shopify-built Chrome extension for inspecting theme performance and structure. Useful for finding which Liquid template generates a given section.

Audit workflow

Step-by-step for a Shopify accessibility audit.

  1. 1

    Audit your active theme on a sample collection + product page

    Pick a representative product (with variants, images, reviews app) and the homepage. Run AccessProof or axe. Most issues cluster in a few templates.

  2. 2

    Bulk-fix product image alt text

    Use the Shopify Admin API or a CSV export-edit-import to bulk-replace empty alt with meaningful product descriptions. Generative AI can draft alt text, but review the output — auto-generated alt often describes pixels, not purpose.

  3. 3

    Audit each Shopify app contribution

    Disable apps one at a time on a development store; re-scan. Identify which apps inject accessibility-broken HTML. Decide app-by-app: remove, request fix from developer, or work around.

  4. 4

    Fix theme settings (colors, fonts)

    Customize theme settings to pass color contrast. Sticking with brand colors at the cost of WCAG conformance is a common but costly choice.

  5. 5

    Schedule continuous monitoring

    Shopify storefronts change weekly (new products, theme app updates, sales banners). Schedule weekly AccessProof scans to catch new regressions.

Scan your Shopify app

Run a WCAG audit on your Shopify site in 42 seconds.

External scan — no JS injected into your app

WCAG 2.2 + Section 508 + EN 301 549 in one pass

Court-ready PDF with element selectors

CI/CD gate — block deploys on regression

Works with Shopify on any hosting (Vercel, Netlify, Fly, self-hosted)

Free plan — 1 site, monthly scan

FAQ

Shopify-specific questions.

Does Shopify's checkout have its own accessibility?

Yes — Shopify Checkout is operated by Shopify, not the merchant's theme. Merchants typically cannot modify it directly (Shopify Plus has some checkout extensions). Shopify's checkout is audited and updated by Shopify; the merchant's ADA exposure is primarily the customizable storefront (theme + apps) above checkout.

Can I install accessibility overlay apps on Shopify?

Yes, they exist on the Shopify app store (accessiBe, UserWay, AudioEye, EqualWeb). They do not provide ADA legal defense — courts and DOJ guidance reject overlays as sufficient. They also affect storefront performance. Recommended: fix the underlying theme/app issues instead.

How do I make my custom Liquid theme accessible?

Start from a modern Online Store 2.0 theme (Dawn) — copy its accessibility patterns (skip links, semantic landmarks, cart drawer focus management, mobile menu behavior). Run AccessProof on your dev theme. Test cart-add and checkout flows with keyboard only and a screen reader.

What if I get an ADA demand letter on my Shopify store?

Do not respond directly. Engage ADA-defense counsel (specialists exist). Run an AccessProof baseline scan to document state at the time of the letter. Continuous dated audit evidence post-letter is the single most important defensive posture. See our `/blog/ada-demand-letters-what-to-do` post for the full checklist.