Accessibility overlay companies promise ADA and WCAG compliance via a single JavaScript widget. The reality is more complicated and more important than most business owners realize.
What Are Accessibility Overlays?
Products like AccessiBe, UserWay, and AudioEye add a JavaScript widget to your site. The widget provides a toolbar offering text resizing, contrast changes, and screen reader adjustments.
The Honest Comparison
| Factor | Accessibility Overlays | Proper Accessible Development |
|---|---|---|
| Implementation | One line of JavaScript | Architecture-level effort |
| Cost | $500-2,000/year | $5,000-20,000 (one-time) |
| Time to deploy | Minutes | Weeks to months |
| WCAG 2.1 AA compliance | Partial (claims full) | Achievable |
| Screen reader compatibility | Often worsens | Proper semantic HTML |
| Keyboard navigation | Superficial fixes | Proper focus management |
| Legal protection | Not recognized by courts | Documented compliance |
| Lawsuits filed against users | Yes (many) | Rarely |
| User experience impact | Confusing overlay UX | Natively accessible |
| Performance impact | 50-200 KB extra JavaScript | None |
| Maintenance | Subscription (ongoing) | Periodic audits |
| False confidence | High | Low |
Why Overlays Fail Technically
- Cannot fix structural issues: Missing alt text, improper heading hierarchy, and missing form labels require HTML changes
- Break existing accessibility: Screen reader users report overlays interfere with their tools
- AI-generated alt text: Inaccurate, generic descriptions that mislead users
- Focus management: Cannot fix keyboard traps or incorrect tab order
- Dynamic content: Cannot make AJAX-loaded content accessible
- Custom components: Cannot fix inaccessible custom widgets
Legal Reality
Courts have consistently ruled that accessibility overlays do not constitute compliance:
- Over 400 ADA lawsuits have been filed against websites using overlays
- The American National Federation of the Blind formally opposes overlays
- The European Accessibility Act does not recognize overlays as compliance
What Proper Accessibility Includes
- Semantic HTML: Correct heading structure, landmarks, labels
- ARIA attributes: Where native HTML is insufficient
- Keyboard navigation: Every interactive element reachable and operable
- Color contrast: WCAG AA minimum (4.5:1 for text)
- Screen reader testing: Actual testing with NVDA, VoiceOver, JAWS
- Focus management: Visible focus indicators, logical tab order
- Alt text: Human-written, contextually appropriate descriptions
- Form accessibility: Labels, error messages, required field indicators
- Responsive design: Accessible at all viewport sizes
- Motion control: Respect prefers-reduced-motion
Our Approach
We build accessibility into every project from the start. Using Radix UI primitives via shadcn/ui gives us WCAG-compliant components by default. We test with screen readers and keyboard-only navigation. Accessibility is not an add-on; it is a design requirement.
Build an accessible website that serves all your users.