Why Accessibility Overlays Don’t Make Your Website Compliant (and What Works Instead)

Why Accessibility Overlays Don’t Make Your Website Compliant (and What Works Instead)

If you run a website, you’ve probably seen the pitch: add one line of JavaScript and your site becomes accessible and legally compliant, powered by AI. A small icon appears in the corner, users can adjust text size and contrast, and the vendor promises protection from lawsuits.

These products are called accessibility overlays. They are popular with businesses because they’re cheap and quick. They are unpopular with many disabled users and accessibility professionals because, in most cases, they don’t solve the underlying problem, and they sometimes create new ones. This article explains why, and what works instead.

Key takeaways

  • Overlays add a layer of scripts on top of your website; they don’t fix the inaccessible code underneath.
  • Automated repairs can only address a portion of WCAG issues, and some “fixes” interfere with users’ own assistive technology.
  • Websites with overlays installed have continued to receive accessibility lawsuits and complaints.
  • In 2025 the US Federal Trade Commission ordered overlay vendor accessiBe to pay $1 million over misleading compliance claims.
  • The reliable path is to fix the code, starting with your design system and key user journeys, and to test with real users and assistive technology.

What is an accessibility overlay?

An overlay is a third-party script added to a website. It usually does two things:

  1. A user-facing toolbar: buttons to enlarge text, change contrast, stop animations, highlight links or switch to a “screen reader mode”.
  2. Automated “repairs”: scripts that scan the page and try to fix problems at runtime, such as guessing alt text for images or adding ARIA attributes.

Vendors often market these as a way to achieve WCAG, ADA or EAA compliance quickly and cheaply.

Why overlays fall short

1. They don’t fix the source code

The inaccessible code is still there. If a checkout button is a div with no keyboard support, the overlay has to detect it, guess what it is, and patch it in the browser every time the page loads, and hope it guesses right. Every time your site changes, the guesswork starts again.

2. Automated detection has hard limits

Automated tools, including the best testing tools used by professionals, can only reliably detect a portion of WCAG failures. Many criteria require human judgment:

  • Is this alt text accurate and meaningful in context?
  • Is the focus order logical?
  • Does this error message explain how to fix the problem?
  • Is the heading structure meaningful?
  • Can this custom widget actually be operated with a keyboard?

If a tool can’t reliably detect an issue, it can’t reliably fix it.

3. They duplicate what users already have

Most disabled people who rely on assistive technology already have it configured the way they like: screen readers, screen magnifiers, browser zoom, high-contrast themes, operating-system text size settings, and browser extensions. An overlay toolbar that offers bigger text or higher contrast duplicates features users already control, often less well.

As a low vision user, I already have magnification and contrast set up the way I need. A widget offering a different version, which only works on one website and has to be activated every visit, doesn’t help me. What helps is a site that works with my existing settings.

4. They can interfere with assistive technology

Some overlay features change how the page is exposed to screen readers or override keyboard behaviour. Users have reported overlays that announce unexpected content, change focus behaviour, or make it harder to navigate. Some disabled users install browser extensions specifically to block overlays.

5. AI-generated alt text is unreliable

Overlays that auto-generate image descriptions can produce text that is generic (“a person standing”), wrong, or missing the point of the image. A wrong description can be worse than none, because the user trusts it. See how to write alt text for why context matters.

Overlay marketing often focuses on legal protection. The record suggests caution:

  • Lawsuits continue. Industry trackers of US digital accessibility litigation have repeatedly reported lawsuits filed against websites that had an overlay installed at the time.
  • Regulators have acted on misleading claims. In 2025, the US Federal Trade Commission finalised an order requiring accessiBe to pay $1 million, over claims that its AI-powered tool could make any website compliant with accessibility guidelines.
  • Professionals have spoken out. Hundreds of accessibility practitioners have signed the Overlay Fact Sheet, a public statement urging site owners not to rely on overlays and vendors to stop claiming compliance.
  • Laws require accessible content, not a widget. Under the European Accessibility Act, Section 508 and ADA-related standards, what matters is whether people can actually use your product. WCAG and EN 301 549 are about the content and code users interact with.

Are all overlay features bad?

Not every feature is harmful in isolation. A user-controlled option to reduce motion or adjust spacing can be genuinely helpful when it’s built into the site properly and doesn’t interfere with assistive technology. The problems come from:

  • Claims that the widget makes a site compliant
  • Automated runtime “repairs” replacing real fixes
  • Features that override users’ own settings and tools

If you want to offer display preferences, build them into your site and respect the user’s operating-system preferences, such as prefers-reduced-motion and prefers-contrast.

What to do instead

1. Audit your key journeys

Start with what matters most: sign-up, search, product pages, checkout, account and contact. Use automated tools for a first pass, then test manually with a keyboard and a screen reader. My screen reader testing guide shows how to start.

2. Fix the high-impact issues first

Most of the barriers people meet come from a short list: low contrast, missing alt text, unlabelled form fields, empty links and buttons, missing page language, and keyboard problems. These are all fixable in code:

3. Fix it at the source

Fix your theme, design system or component library once, so every page benefits. That is far cheaper than fixing pages one by one, and far more reliable than runtime patches.

4. Publish an honest accessibility statement

Say what standard you’re working towards, known issues, and how users can contact you for help or alternative formats. Honesty builds more trust than a badge.

5. Make accessibility part of your process

Add accessibility to design reviews, acceptance criteria and QA. Re-test after major releases. Involve disabled users in research where you can.

What if you already have an overlay?

You don’t need to panic, but don’t treat it as your compliance strategy:

  1. Audit the site with the overlay turned off to see the real state of the code.
  2. Fix the underlying issues, starting with key journeys.
  3. Check with a screen reader whether the overlay interferes with navigation. If it does, remove it.
  4. Remove any claims on your site that the widget makes it compliant.

Conclusion

There’s no one-line fix for accessibility, because accessibility lives in your content, design and code. Overlays can look like a shortcut, but they leave the real barriers in place and can introduce new ones. Fix the source, test with real assistive technology, and be honest about where you are. It takes longer than pasting a script, and it actually works.

Further reading

1 Comment

Leave a Reply

Your email address will not be published. Required fields are marked *