Guide · Shopify

Accessibility overlays on Shopify: what they do, and what to do instead

Last updated

General information, not legal advice. Laws differ by country; for your situation, ask a lawyer.

Search the Shopify App Store for "accessibility" and most results are widgets: a small icon in the corner that opens a toolbar with font sizes, contrast modes and a "read aloud" button, often combined with automatic repairs. These are usually called accessibility overlays. They install in a minute and are marketed as a quick answer to the European Accessibility Act (EAA).

This guide explains what overlays do technically, what regulators and disability organisations have said about them, what the data on EU Shopify stores shows, and what to do instead. It is not a verdict on any single product: what a specific tool does on your store is something you can test.

In short

  • An overlay is a script that adds a toolbar and tries to repair barriers at runtime. Your theme code stays as it is.
  • The European Disability Forum and the IAAP (2023) said overlays are no substitute for fixing the website itself.
  • The US Federal Trade Commission ordered accessiBe in 2025 to pay $1 million over claims about what its product could do.
  • On EU Shopify home pages with an overlay, automated checks still found barriers on 88.5% of them.
  • What works: fix the theme, fill in alt text, test with real assistive technology and document the work.

What an overlay does

An overlay is JavaScript loaded into your storefront. It typically works on two levels:

  1. A toolbar for visitors: switches for text size, contrast, line spacing, reading aloud or pausing animations. Most of these already exist in the visitor's operating system or browser, set up the way they need them.
  2. Automatic "repairs": the script tries to add missing alt text, labels or ARIA attributes while the page loads, sometimes using image recognition.

Neither changes your theme. If the script loads slowly, is blocked, or guesses wrong, visitors get the original page with all its barriers. And the people who most need an accessible store, such as blind shoppers with a screen reader or people who navigate by keyboard or switch, already bring their own tools. What matters is whether your store works with those tools, not whether it offers another one.

What the EAA asks for

The European Accessibility Act (Directive (EU) 2019/882) asks that services, including online stores, are made perceivable, operable, understandable and robust (Annex I), and that providers publish information on how their service meets the requirements (Article 13 and Annex V). The technical reference is the European standard EN 301 549, which includes the WCAG success criteria for web content.

Two points follow for overlays. First, the requirements apply to the service people actually use, with the assistive technology they actually have. A toolbar a shopper first has to find and learn is not the same as a store that works with their screen reader. Second, a store that becomes usable only after a third-party script has run depends on that script. Neither the directive nor any national law we have read gives a store credit for installing a widget. Whether a given product helps in a given case is a question of testing.

What regulators and experts have said

European Disability Forum and IAAP (2023)

In a joint statement of 17 May 2023, the European Disability Forum and the International Association of Accessibility Professionals said that overlays do not make a website accessible or bring it in line with European accessibility legislation, and that "they do not constitute an acceptable alternative or a substitute for fixing the website itself". They also warned that overlays can override the settings users have made in their own assistive technology. Their advice: fix the website, work with accessibility experts and involve people with disabilities.

The Overlay Fact Sheet

The Overlay Fact Sheet is an open letter signed by a long list of accessibility practitioners, developers and people with disabilities. Its signatories state that overlays are "not an effective means of ensuring accessibility", that automated repairs are unreliable, and that some overlays raise privacy concerns. They commit to advocating "for the remediation of accessibility issues at the source of the original error".

US Federal Trade Commission (2025)

On 22 April 2025 the FTC approved a final order requiring accessiBe to pay $1 million. According to the FTC, the company had claimed that its automated product could make any website meet WCAG, which the complaint called "false, misleading, or unsubstantiated", and had formatted third-party reviews and articles to look independent without disclosing its connections to them. The order bars such claims without supporting evidence. The case is about advertising, not about whether an individual store is accessible, but it shows how regulators treat promises that a script can solve accessibility on its own.

W3C

The W3C's guidance on selecting evaluation tools makes the same point from the testing side: tools help, but many accessibility checks need human judgement. A tool that cannot reliably judge a barrier cannot reliably repair it either.

What the data on EU Shopify stores shows

For our study of EU Shopify home pages, we used the public HTTP Archive crawl of 1 September 2026: 5,569 Shopify home pages on EU country domains, mobile view, home pages only, automated Lighthouse checks only. The crawl's technology detection named an overlay or toolbar product on 54 of them (1.0%). Detection is imperfect, so that share is a lower bound.

EU Shopify home pages with and without a detected overlay (HTTP Archive, 1 September 2026)
MeasureOverlay detectedNo overlay detected
Pages with a Lighthouse result525,411
Images without alt text48.1%35.9%
Text with low colour contrast59.6%74.8%
Zoom blocked11.5%17.1%

Lighthouse audits the page after it has loaded, so what an overlay changes during loading is part of the measurement. On pages with an overlay, automated checks still found at least one WCAG 2.1 level A or AA barrier on 88.5% of them, and the average number of failing checks was the same as without an overlay (3.3). With 52 pages, differences in single rows are within noise in both directions. What the data does show: nearly nine in ten of these pages still had barriers a machine can find, and most EU Shopify stores have not installed an overlay at all.

What a toolbar can fairly offer

To be fair: not every toolbar function is harmful. Some visitors like a read-aloud button or a contrast switch, and some tools make problems visible to the merchant. The trouble starts when

  • a widget is sold as a replacement for accessibility in the code,
  • it interferes with visitors' own assistive technology (duplicate announcements, moved focus),
  • it is marketed with promises it cannot back up, such as meeting every legal requirement or protecting you from legal action,
  • it shows a seal or label suggesting the store has been tested and meets all requirements.

For your own accessibility information, the same applies: do not write that your store is accessible "thanks to" a widget. Describe what is actually in place, and which barriers are known. Our guide to the accessibility statement for Shopify explains what to include.

What to do instead

1. Find the barriers in your theme

Run an automated check on your key templates: home, collection, product, cart. Most frequent findings, such as contrast, unnamed icon links and blocked zoom, sit in the theme and repeat on every page.

2. Fix them in the code and the admin

Our guide to the 7 most common Shopify accessibility fixes shows where each one lives. One fix in a theme section repairs every page using it, and it works for every visitor without any script.

3. Test with people and real tools

Automated checks find only part of the barriers. Place a test order with the keyboard only and with a screen reader such as VoiceOver or NVDA. If you can, ask people with disabilities to try your store.

4. Review your apps

Pop-ups, review widgets and chat buttons bring their own markup. Check each one the same way, and ask the app developer to fix what you find.

5. Document honestly

Keep a dated record of what you checked, fixed and what is still open. It is the basis for honest accessibility information. The EAA checklist for Shopify stores gives you the full list of points to work through.

How Testamur helps

Testamur is a Shopify app in development, built as an accessibility record, not an overlay: it adds no script to your storefront. The free check is available now. The app is designed to find barriers in your theme, suggest code-level fixes, draft country-specific accessibility information and keep a dated record of scans and fixes. It shows only what automated checks can detect and does not replace testing by people or legal advice. You can check your own store for free.

Sources

Check your store free

See which barriers an automated check finds on your own Shopify store: the home page and, where your robots.txt allows, collection, product and legal pages, mapped to WCAG and EN 301 549. Free, result by email. Automated checks find part of the barriers, not all of them.

Check your store free

Frequently asked questions

Does an accessibility overlay make my Shopify store meet the EAA?

No law gives a store credit for installing a widget. The European Accessibility Act asks that the service itself is perceivable, operable, understandable and robust for people using their own assistive technology. The European Disability Forum and the IAAP said in 2023 that overlays are no substitute for fixing the website itself.

What did the FTC decide about accessiBe?

On 22 April 2025 the US Federal Trade Commission approved a final order requiring accessiBe to pay $1 million. The order bars the company from claiming, without evidence, that its automated products can make any website meet WCAG, and from presenting paid or connected reviews as independent.

Should I remove an overlay I already have?

Test your store with the overlay switched off. If shoppers using a screen reader or keyboard can still buy, the overlay adds little. If they cannot, the barriers are in your theme and need fixing there. Also check whether the overlay interferes with screen readers, for example with duplicate announcements or moved focus.

What is the alternative to an overlay on Shopify?

Fix barriers at the source: contrast and focus styles in the theme settings and CSS, labels for icon links and buttons in the Liquid code, alt text in the admin. Then test with a keyboard and a screen reader, and keep a dated record of what you found and fixed.

About the author

Sieghart Michielsen. Sieghart Michielsen builds Testamur, a Shopify app that checks EU storefronts for accessibility barriers and keeps a dated record of scans, fixes and accessibility statements. He writes these guides from the legal texts, the authorities’ own pages and public data. He is not a lawyer.