The Overlay Problem

Why accessibility overlays
don't work

Overlay widgets promised quick compliance, but W3C guidance and disability advocates have raised significant concerns. Here's why.

Understanding Overlays

What are accessibility overlays?

Overlay widgets are JavaScript tools that promise to make websites accessible without code changes.

How overlays claim to work

1

You add a JavaScript snippet

A single line of code loads the overlay widget onto your site.

2

"AI" modifies your site in real-time

The widget attempts to add ARIA labels, adjust colors, and modify elements on-the-fly.

3

Quick compliance claims

However, W3C WAI documentation explains that automated tools have inherent limitations and cannot evaluate all WCAG success criteria without human judgment.

The fundamental problem

Overlays don't fix your actual code. They add a layer of JavaScript that attempts to compensate for accessibility issues. But this approach is fundamentally flawed — you can't paper over structural problems with client-side modifications.

Common Limitations

Four reasons overlays have limitations

Based on industry research and feedback from the accessibility community.

Can interfere with screen readers

Screen reader users have reported that overlay widgets can make sites harder to use, not easier. The modifications may interfere with assistive technology navigation patterns.

The Overlay Fact Sheet, signed by accessibility professionals and disability advocates, documents these concerns.

Don't fix your actual source code

Missing form labels, improper heading structure, keyboard traps — these are code problems that require code fixes. JavaScript patches can't change your server-rendered HTML structure.

  • Missing alt text on images
  • Broken keyboard navigation
  • Improper form labeling
  • Missing skip links

Don't address root causes

Runtime modifications don't fix the underlying code issues. When the overlay fails to load or is blocked, accessibility barriers return immediately.

DOJ web accessibility guidance emphasizes fixing issues at the source code level.

May conflict with user preferences

Overlay "fixes" can conflict with users' own assistive technology settings and preferences. Users who have customized their experience may find overlays disruptive.

The best accessibility approach respects user preferences and works with—not against—assistive technology settings.

Community Resource

The Overlay Fact Sheet

A joint statement from disability advocates, accessibility professionals, and developers outlining concerns about overlay-based accessibility solutions.

Read the Overlay Fact Sheet

Signed by hundreds of accessibility professionals and disability advocates worldwide. This statement represents the views of its signatories.

Regulatory Guidance

What regulators say

Both the DOJ and W3C WAI have published guidance and enforcement actions addressing web accessibility. These sources emphasize the limitations of relying solely on automated tools.

Automated tools have limitations

They detect ~30-40% of issues; manual testing remains essential

Code-level fixes are preferred

Fixing issues at the source is more reliable than runtime modifications

Good-faith remediation matters

Documented efforts to improve accessibility demonstrate compliance intent

See Our Approach
~30-40%
Issues detectable by automation
W3C WAI guidance

The right approach includes

Automated
Regular scanning for known issues
Manual
Human review for complex issues
What Actually Works

The right approach

Real accessibility requires real work. Here's what actually makes a difference.

External scanning

Scan your site without injecting code. Identify real issues in your actual HTML.

Remediation guidance

Get code examples so your team can fix issues in source code where they belong.

Manual testing

Combine automated scans with human review. Some issues can only be found by people.

Continuous monitoring

Regular scans to catch regressions. Accessibility is ongoing, not one-time.

Audit documentation

Timestamped evidence of your assessment efforts. Legal protection through transparency.

Honest limitations

Know what automated tools can and can't find. No false compliance claims.

Choosing an Alternative

What to look for in an overlay alternative

If you're moving away from overlay widgets, here's what an effective accessibility tool should offer.

Scans your actual code

The tool should analyze your real HTML, not inject JavaScript on top of it. External scanning catches issues in your source code where fixes belong.

Transparent about limitations

Any honest tool will tell you automated scanning catches ~30-40% of WCAG issues. If a tool claims full compliance, that claim is inconsistent with industry research.

Provides remediation guidance

Detection alone isn't enough. Look for tools that provide actionable code examples your team can implement — ideally framework-specific fixes for React, Vue, or your CMS.

Generates audit documentation

Regulatory guidance emphasizes good-faith remediation efforts. Your tool should produce timestamped evidence of scans, issues found, and fixes applied.

Flags what needs manual review

The best tools don't just report automated findings — they tell you which WCAG criteria require human judgment, like alt text quality or logical reading order.

Monitors continuously

Accessibility isn't a one-time fix. Content changes, new features, and dependency updates can introduce regressions. Scheduled scanning catches issues before users do.

Overlay FAQs

Common questions about accessibility overlays and what works instead.

Why can overlays interfere with screen readers?

Overlays inject JavaScript that modifies the DOM in real-time. This can conflict with how screen readers interpret and navigate pages. The modifications may remove focus, change reading order, and override user preferences. Learn more from disability advocates.

Why do companies choose overlay solutions?

The appeal is understandable: compliance without code changes seems like an easy solution for companies concerned about accessibility requirements. However, W3C WAI guidance indicates automated tools alone cannot ensure full compliance.

What should I do if I'm currently using an overlay?

Consider evaluating your actual accessibility status with a code-level assessment. Understand what issues exist in your source code and guide your team to prioritize fixing them. Document your remediation efforts as evidence of good-faith compliance work.

Can automated tools achieve full WCAG compliance?

No. According to W3C WAI, automated tools can detect approximately 30-40% of accessibility issues. Many WCAG criteria require human judgment — like whether alt text is meaningful, or whether content is logically organized.

What percentage of issues can inclly detect?

inclly's automated scans detect approximately 30-40% of WCAG issues, in line with industry research. We're transparent about this limitation. Our reports clearly indicate what was tested automatically and what your team should review manually.

What is the best alternative to accessibility overlays?

The most effective alternative is code-level accessibility testing — tools that scan your actual HTML and provide remediation guidance your developers can implement. Look for tools that are transparent about automation limitations, provide audit documentation, and flag issues requiring manual review.

No overlays, no false promises

Ready for real assessment?

Stop relying on JavaScript band-aids. Get real insights into your site's accessibility status with actionable guidance for your team.