Accessibility Overlays: What Site Owners Need to Know

Accessible design is key to any website’s success. After all, over a quarter of U.S. adults have a disability. If your site turns away 26% of visitors, it’s not serving its purpose very well.

Accessible web design also tends to improve user experiences across the board, which, in turn, boosts search engine optimization (SEO). And thanks to a steady rise in digital accessibility lawsuits—cases rose from just over 2,300 in 2018 to well over 4,000 in 2022—there’s a greater incentive for accessible design than there ever was.

This carrot-and-stick dynamic is leading lots of business owners to consider digital accessibility for the first time. Unfortunately, not everyone takes the time to understand what it really means to build an accessible website.

Some site owners look for the quickest, cheapest fix: A tech tool that instantly delivers compliance with disability laws and accessibility standards—and shields the organization from accusations of discrimination.

Enter the accessibility overlay, a technology that purports to solve all your digital-accessibility challenges at once. To be clear, no such solution exists. True accessible design requires ongoing engagement with Web Content Accessibility Guidelines (WCAG), the leading global standard for accessible web design.

That said, website plugins may be one part of a broader approach to WCAG compliance and digital accessibility. Here’s a guide to the complex, often contentious subject of accessibility overlays.

What is an accessibility overlay?

An accessibility overlay is a software tool designed to remove access barriers from a website. Typically, accessibility overlays are JavaScript plugins that run in the web browser. Many overlays alter (or give users the option to alter) how content appears: font size, color contrast, text-only mode, etc.

These changes can make web-based content more readable for users with visual impairments, developmental disabilities, reading difficulties, and more. But overlay developers didn’t stop with content presentation.

More recently, products arrived that promised to automate accessible design at the source-code level. These auto-repair tools scan page code and identify accessibility barriers, then attempt to automatically remove them.

The term accessibility overlay may refer to a content-modification plugin or an auto-repair tool, depending on the context. Either way, web users with disabilities report unexpected flaws in some of this technology.

What’s the case against accessibility overlays?

As the New York Times pointed out in 2022, some web-users who are blind find that accessibility overlays disrupt screen readers and keyboard navigation. As overlays reformat pages, they can inadvertently hide buttons and other interactive elements from assistive technology (AT).

Auto-repair overlays can also give site owners a false sense of security, ultimately concealing accessibility flaws. For example, screen readers can’t recognize unlabeled buttons. If you trust the software to label every button, you’re less likely to conduct the rigorous testing that reveals missing or mistaken object labels.

All of that helps to explain why, in 2021, hundreds of advocates and web designers signed an open letter rejecting the use of accessibility overlays. That letter—the Overlay Fact Sheet—points out several more problems with these tools:

1. At best, tools that modify content presentation are redundant with existing AT.

If users need assistive tools to access website content, they probably need those tools for all software. That means a user will already have the tools they need by the time they reach your website. If they didn’t, they wouldn’t have been able to open the browser in the first place.

2. Accessibility overlays can’t guarantee full compliance with WCAG.

Plugins can help site owners comply with some WCAG standards, says the Overlay Fact Sheet. But the open letter also quotes WCAG 2.1’s description of “conformance” with the guidelines:

“To conform to WCAG 2.0, you need to satisfy the Success Criteria, that is, there is no content which violates the Success Criteria.”

The Overlay Fact Sheet interprets this to mean that compliance with WCAG means compliance with all WCAG Success Criteria. No single product can do this, the authors say, which means compliance claims from overlay providers “should be viewed with significant skepticism.”

3. Automated repair overlays can’t fix every accessibility flaw.

Some accessibility issues require a thoughtful approach. While artificial intelligence is becoming more powerful, it’s not yet capable of exercising human judgment.

For example, images need alternative text (also called alt text) that describes their purpose. An overlay can determine whether an image contains alt text, but it cannot write an accurate description of that content. A human needs to determine whether the description is useful.

Likewise, accessibility overlays can fix HTML issues such as out-of-order subheadings, but cannot write new subheadings to improve the web page’s organization.

To provide a truly equitable experience for users with disabilities, you’ll need to fix some issues manually—and if you rely on an accessibility overlay alone, you’ll miss opportunities to make those improvements.

Should site owners ever consider using accessibility overlays?

While overlays have limitations, that’s true for every new technology. Automated accessibility improvements can be helpful for some users, especially when utilized as part of a broader approach to digital compliance.

In other words, don’t use overlays that promise perfect results. However, if a technology is designed to complement the best practices of accessible design, it may be worthwhile.

Some potential use cases for accessibility overlays include:

1. Temporary fixes while making more in-depth changes to site design.

Advocacy group The A11Y Project differentiates between temporary accessibility plugins and permanent overlays. A tech tool can function as a Band-Aid, The A11Y Project says, providing a working fix for accessibility problems while you correct site design. That can be helpful.

A permanent accessibility overlay, however, allows site owners to imagine they’ve “solved” every access problem once and for all.

“Any permanent plugin that claims to automatically ‘fix’ these kinds of issues cannot deliver on its promise,” The A11Y Project writes. (Read more about the A11Y Project in our post about accessibility in education.)

2. Improving access for users who don’t have access to AT.

One of the most serious complaints against overlays is that they may disrupt assistive technology. However, according to the World Health Organization, 90% of the people around the world who need AT tools don’t have them.

If you serve a global audience, you can’t assume your users have access to screen readers. Web- or browser-based text-to-speech (TTS) tools—which also convert online text into synthetic speech—can help fill the gap.

3. Implementing improvements across large amounts of complex or dynamically generated content.

If your website generates content dynamically, you might not be able to test every piece of content for accessibility. A cloud-based technology may be able to make certain accessibility improvements automatically, which could benefit users with disabilities.

Of course, if you have a large amount of dynamically generated content, you’ll still need to follow the best practices of accessibility. That means using appropriate semantic HTML and WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications) markup.

But an overlay may reduce the number of accessibility barriers, which could help you focus on issues that require human judgment.

How can you tell if a cloud-based accessibility tool will make things better or worse?

The goal of digital accessibility is to improve experiences for as many users as possible. That includes people who use screen readers and other AT, but it also includes people who use widely available technologies (such as mobile devices) to access the web.

To that end, when evaluating accessibility tools, you’ll need to think about the experiences of real users. Some questions to consider:

• Will the tool introduce new barriers for people who use AT?
• Is the tool optional? Can users turn it off if they don’t need it?
• Does your website still provide an accessible experience when the tool is disabled?
• Can users operate the accessibility tool’s controls with a keyboard alone?

Look for tools that have been evaluated for accessibility conformance. The standard here is the Information Technology Industry (ITI) Council’s Voluntary Product Accessibility Template version 2.2., which evaluates against WCAG 2.0. View ReadSpeaker’s VPAT 2.2 accessibility conformance report.

If your goal is to build a truly accessible website, the best practice is to evaluate your content against WCAG. Focus on fixing the issues that are most likely to affect your users (generally, that means WCAG’s Level A requirements) and, wherever possible, avoid using automated tools for remediation.

With that said, you can still use web-based tools to improve user experiences. If those tools are truly optional, they’re beneficial—particularly if they offer new functionality. ReadSpeaker offers a full range of TTS solutions, including browser-based literacy tools, integrations with learning management systems, and lifelike voices for augmented and alternative communication (AAC) devices.

Our web-based tools avoid the pitfalls of accessibility overlays by placing the user fully in control of all changes to content. We also ensure that our products comply with WCAG through partnerships with recognized testing services. View ReadSpeaker’s ILUNION certification for Double-A WCAG compliance.