Shopify Accessibility: What the EAA Requires
Shopify accessibility is no longer only a craft question. Since 28 June 2025 the European Accessibility Act has applied to e-commerce services sold to consumers in the EU, and it reaches you on the basis of where you sell rather than where you are registered. A store run from Cairo, London or Austin that ships to Germany is in scope on the same terms as a German one.
The short answer to the question most merchants ask: no, a well-built theme does not make you compliant. Shopify hands you a reasonable starting point and then hands you the pen. Accessibility is a property of the live store — your content, your customisations, your apps — and that is the part nobody audits until someone complains. Below: what the Act asks for, why the theme baseline stops short, the failures we find on almost every store we open, and the order to fix them in.
What the European Accessibility Act actually asks of an online store
The Act (Directive (EU) 2019/882) does not itself list rules for buttons and colour. It sets out accessibility requirements for a set of products and services — e-commerce among them — and leans on a harmonised European standard, EN 301 549, for the technical detail. EN 301 549 in turn imports the Web Content Accessibility Guidelines more or less wholesale. So the working bar for a storefront is WCAG at level AA. If you are doing the work once, build to the most recent WCAG version rather than the oldest one that would satisfy an auditor — the standard has tracked WCAG’s own releases, and the newer criteria are the ones covering things like target size that modern storefronts routinely fail.
Scope is where merchants get this wrong in both directions, so it is worth being precise:
| Situation | In scope? |
|---|---|
| You sell to consumers in the EU, from anywhere in the world | Yes — scope follows the market, not your head office |
| You have fewer than 10 staff and turnover or balance sheet total of €2m or less, and you provide a service | No — the microenterprise exemption covers services |
| You are a microenterprise, but you manufacture or distribute covered products | Yes — the exemption is for services only |
| You sell B2B only, with no consumer-facing storefront | Generally outside the consumer e-commerce scope |
Two caveats. Enforcement sits with individual member states, each of which transposed the directive into its own national law with its own regulator and penalties — Germany’s BFSG is the most cited, not the only one. And the microenterprise threshold is a live number: crossing ten employees changes your obligations, so a growing brand should not treat the exemption as permanent. None of this is legal advice; where the answer has money attached, it belongs with your own counsel.
Why Shopify accessibility is not a theme setting
Shopify does set a real bar for themes sold in its Theme Store. Those requirements are public, and they are not trivial: a minimum average Lighthouse accessibility score of 90 across the home, collection and product templates on both desktop and mobile; every part of the page reachable by keyboard, dropdown navigation included; a visible focus state on focusable elements; focus order that matches DOM order; text contrast of 4.5:1 for body copy and 3:1 for large text and non-text elements such as borders and icons; touch targets of at least 24×24 CSS pixels; alt attributes on images; and form labels whose IDs actually match their inputs.
That is a good foundation. It is also a statement about a theme as submitted, in its demo configuration — not about your store as published. Everything that makes the store yours happens after that snapshot.
The hosted checkout is the one place where this works in your favour: on Shopify’s own checkout you do not control most of the markup, and you are not the one who has to fix its focus order. That is a genuine advantage over a self-hosted stack, where checkout is entirely your problem. Everything before the checkout — and any checkout UI extensions you add on Plus — is yours.
The five failures we find most often
These are not exotic. They are what turns up when you open a live, well-tended Shopify store and start pressing Tab.
1. Contrast on the parts nobody re-checked
Themes ship compliant defaults and then a brand palette lands on top of them. The casualties are consistent: sale badges in a light accent on white, placeholder and helper text set in a muted grey, disabled-looking secondary buttons, and text laid over a lifestyle photograph whose brightness varies per product. Run the actual pairs rather than trusting the palette — our free WCAG contrast checker will tell you in seconds which of them clear 4.5:1.
2. Alt text that describes the file, not the product
Shopify supports alt text on every product image; the field is simply left empty at import, or filled by a bulk script with the product title repeated across all seven angles. For a shopper using a screen reader, seven identical descriptions are worse than one good one. Purely decorative images should carry an empty alt attribute so they are skipped rather than announced.
3. Keyboard traps in drawers and modals
Cart drawers, quick-view modals, filter panels and newsletter pop-ups are the usual offenders. The pattern is always the same: the overlay opens, focus stays behind it on the page underneath, and Escape does nothing. A keyboard user is now stranded. Open every overlay on your store using only the keyboard and confirm that focus moves into it, stays inside it while it is open, and returns to the trigger when it closes.
4. Forms held together by placeholder text
Placeholders are not labels — they disappear the moment someone types, and assistive technology treats them differently. Every input needs a real label whose for matches the input’s id, and errors need to be announced rather than only turning red. This overlaps almost exactly with conversion work: the same fields that fail an accessibility check are the ones quietly costing you sales.
5. Apps that inject markup nobody reviewed
Review widgets, upsell blocks, cookie banners, currency switchers and chat bubbles all inject DOM into your storefront, and their accessibility is not covered by your theme’s certification. A chat launcher with no accessible name, or a cookie banner that traps focus before a visitor reaches the page, will fail an audit no matter how clean the theme underneath is. It is the same governance problem as the one your app stack creates for store speed: every install is a change to production that nobody reviewed.
| What you notice | What it usually is | Where it gets fixed |
|---|---|---|
| Badge or helper text looks faint | Contrast below 4.5:1 | Theme settings / brand palette |
| Screen reader reads the same phrase seven times | Duplicated or templated alt text | Product media, per image |
| Tab key disappears behind an open drawer | No focus trap, no Escape handler | Theme JavaScript |
| Field meaning vanishes once you type | Placeholder used instead of a label | Theme templates and sections |
| Chat or cookie widget cannot be reached or dismissed | Third-party injected markup | The app — or removing it |
Overlay widgets do not close the gap
There is a category of app that promises compliance from one script tag: a floating button offering high-contrast and larger-text modes. They appeal because the alternative is real work. They are also contested — disability advocacy groups have argued for years that overlays fail the users they claim to serve, and a script running after the fact cannot invent a missing label, restructure a heading order or fix a focus trap inside someone else’s widget. Treat an overlay as a cosmetic layer over an unfixed store, never as evidence of conformance.
A sensible order to fix things in
Accessibility work sprawls if you let it. Sequence it so that the highest-risk, highest-traffic paths are sound before anyone touches an edge case.
- Audit the buying path first — home, collection, product, cart, checkout — with a keyboard and a screen reader, not only an automated scanner. Automated tools reliably catch contrast and missing attributes; they cannot tell you that your focus order is nonsense.
- Fix global theme issues, because they are single changes with sitewide effect: focus states, colour tokens, heading hierarchy, skip links.
- Then templates — product media alt text, form labels, filter and drawer behaviour.
- Then apps. Ask each vendor for their conformance position; replace the ones that cannot give you a straight answer.
- Document what you did and keep checking. Accessibility regresses with every theme edit and every install, which is why it belongs in the same routine as performance rather than in a one-off project.
If you would rather start with a read of where you stand, a free Shopify store audit will surface the structural issues alongside the speed and conversion ones. Where the findings point at the theme itself rather than at settings, our UI/UX design service handles remediation, and the Shopify store redesign cost page sets out what a rebuild rather than a repair tends to involve.
Frequently asked questions
Does the EAA apply to my store if I am not based in the EU?
Yes, if you offer your service to consumers in the EU. The Act follows the market you sell into rather than the country you are registered in, which is why non-EU brands shipping to Europe are in scope on the same terms as European ones.
Is my Shopify store compliant if I use a Theme Store theme?
No. Theme Store requirements are checked against the theme as submitted, in its demo configuration. Your palette, your content, your section arrangement and your installed apps all sit on top of that and are not covered by it.
What is the fastest thing I can do this week?
Two things, both cheap. Tab through your entire buying path and note anywhere focus vanishes or you cannot escape an overlay. Then run your brand colour pairs through a web accessibility contrast check. Those two passes surface most of what an automated scan would flag, plus the keyboard problems it would miss.
The takeaway
Shopify gives you a defensible starting point and a checkout you do not have to fix yourself. Everything above that line is yours, and the European Accessibility Act has turned it from a quality question into a market-access one for anyone selling into the EU. Start with the buying path, fix globally before you fix locally, hold your apps to the same standard as your theme, and treat it as maintenance rather than a project — because the next theme edit will undo some of it.
Current store performance