What Is an Overlay?
According to Dictionary.com, an overlay is:
noun
- something laid over something else; covering.
- a layer or decoration of something applied: an overlay of gold.
Accessibility overlays are very similar ... they are laid on top of a website. They are applications and code that lay between a website and its user. In the case of accessibility overlays, the user is often assistive technology. Accessibility overlays are often referred to as widgets, toolbars, apps, plugins, and in some cases, pop-ups.
How Do Overlays Work?
Accessibility overlays are super easy to install. A line or two of Javascript is inserted into your website code, creating a visible button on all web pages, normally in the corner of the page. When that button is clicked, the user will see a pop-up with a list of accessibility options – all this without changing the underlying code.
Accessibility Overlay Button | Miami Heat
Accessibility Overlay Mouseover Button | Miami Heat
Accessibility Overlay Pop-up | Miami Heat
How Do Overlays NOT Work?
Most of the functionality provided by overlays has little to no impact on your WCAG conformance level, nor do overlays provide any substantial legal protection.
According to a blog post on Accessibility Works, overlays “can only detect ~30% of WCAG issues in the first place. This is because the WCAG is nuanced and interpretive.” Overlays only fix the easy stuff. Here’s a sample of some WCAG criteria that overlays cannot address: keyboard traps, incorrect heading structure, misidentified language, closed captions, focus order. (See a more expansive list at The Many Pitfalls of Accessibility Overlays.)
Overlays override assistive technology. Take screen readers, for instance. People who depend on this type of assistive technology have a preferred tool they are comfortable using and have customized to how they navigate the web. They have set up their devices to meet their individual needs regarding text-to-speech, screen magnification, color contrast, etc. When an overlay is invoked, all of those settings and customizations are then unavailable.
Joe DiNero, head of the UsableNet’s User Testing group and longtime screen-reader user, has this to say about overlays:
“Using the overlay screen reader instead of my regular screen reader locks me into a small set of features such as arrow, tab and maybe heading navigation. When I use my screen reader on a regular site that has been properly coded or fixed for accessibility, I can access any form control on the screen (buttons, edit fields, aria controls, etc.), and I have the ability to pull up a list of links on the page. Moving to the overlay removes all powerful and useful features from me.”
Overlays Are Secure, Right?
Well, since overlays are scripts, with most hosted by the vendor, you open up the door to security risks and relinquish control of website performance.
In other words, if the vendor server gets hacked, your server is now at risk. If a vendor’s script runs slow, guess what?
Price Check!
Here’s some price information for the three major overlay providers and their basic plan. Both EqualWeb and TruAbilities have a free plan available.
- AccessiBe | under 1,000 unique pages, $490/year
- EqualWeb | 100-100,000 pages, $390/year
- TruAbilities | up to 1,000 page views, $25/month
Not a lot of money, but certainly not a lot of return on investment.
Chancey Fleet, an Affiliate-in-Residence, Data and Society Research Institute, says this about investing in overlays:
“Organizations that invest in these overlays are spending money without building the internal capacity to make their websites natively accessible, locking them in to ongoing costs without organizational progress. Even worse, overlays are often accepted by organizations as a guarantee that the websites to which they are applied will be accessible for customers and employees.
This false sense of security can lead to procurement decisions that end with inaccessible sites being deployed, with the disastrous outcomes of alienating customers, making employees less productive, and exposing organizations who bought overlays to legal liability and the unhappy task of retooling entire websites after deployment.”
Last but not least, Legal Stuff
Usablenet, A Record-Breaking Year for ADA Digital Accessibility Lawsuits
Overlays may appear like a magic pill that will remediate all your accessibility issues. But truly, they will never replace designing with accessibility in mind and should never be considered a permanent solution.
Resources:
- Web Accessibility Overlays Don’t Work (NOTE: This webpage is intentionally broken to show what overlays can and cannot do.) | Karl Groves
- The Many Pitfalls of Accessibility Overlays | Essential Accessibility
- 4 Reasons Why A11Y Overlays Fall Short | Usablenet
- Why Accessibility Overlay Solutions Fail to Protect or Serve | Accessibility.Works
- Accessibility Overlays: What You See You Already Have (video) | Karl Groves
- Using an overlay wastes money and does not build accessibility capacity
- A Record-Breaking Year for ADA Digital Accessibility Lawsuits | Usablenet
