What are accessibility overlays?

An ‘overlay’ refers to a toolbar or plugin which claims to fix accessibility issues.

Accessibility overlays put a piece of JavaScript code between your website and the browser. They offer users a way to customise how the website displays.

They take the form of accessibility plugins, toolbars, widgets, or apps. Others call themselves ‘assistive toolbars’.

For the user, overlays appear as a clickable button on the site that brings up a different set of controls. These controls might let you change the visual appearance of the webpage.

Including things like:

  • changing the contrast between text and background colours
  • adjusting the font size or type
  • auto-filling any images on the page with alt-text
  • adding a focus border to elements, if they are using the keyboard to navigate
  • pausing animations and GIFs

Most overlay services require the website owner to pay a monthly or annual subscription fee. Examples of accessibility overlays or widgets include AccessiBe, Equalweb and UserWay. Examples of assistive toolbars include ReciteMe and ReachDeck (formerly Browsealoud).

The main appeal of using accessibility overlays is that they promise:

  • to make your website compliant with Web Content Accessibility Guidelines
  • accessibility without having to change any of the underlying code
  • to resolve accessibility issues instantly. And without hiring an accessibility professional, web developer or disabled people to test

Unfortunately, this isn’t the case. There is no ‘quick fix’ to accessibility. And they can make your website more inaccessible to the customers you’re trying to help.

Why accessibility overlays are bad for accessibility

Accessibility overlays are bad for many people for several reasons. They:

  • do not make your website WCAG compliant
  • can fix minor problems but not serious user experience issues
  • conflict with and override a user’s existing assistive technologies like screen readers
  • do not compare to manual accessibility audits
  • do not work well on mobile
  • do not offer an equal website experience for disabled users

The main issue with overlays is that they don’t change the underlying code of your website.

And it’s not just us.

Many disabled users and international accessibility experts agree that overlays are unhelpful.

Overlay Fact Sheet is a statement signed by more than 570 global accessibility experts on the ineffectiveness of overlays. The list includes those who have dedicated their careers to improving accessibility. As well as end-users who are disabled, or both.

WebAIM’s Survey of Web Accessibility Practitioners found that 72% of disabled accessibility experts found overlays ‘not at all’ or ‘not very’ effective. With only 2.4% rating them ‘very effective’.

Let’s discuss why overlays and toolbars are not a long-term accessibility solution. And how they can create extra barriers for disabled people.

Overlays do not make your website WCAG compliant

Overlays do not fix serious accessibility barriers. They can only address a small percentage of accessibility barriers. They cannot pick up more serious issues, like:

  • content accessibility
  • unlabelled form fields
  • good focus order for people who are using a keyboard to tab around the website
  • incorrect heading structure
  • missing links and unhelpful link text

This means your website stays inaccessible, regardless of what the overlay does.

UsableNet’s 2020 Digital Accessibility Report revealed that the number of Americans with Disabilities Act (ADA) lawsuits rose by 50% compared to before the pandemic.

200 of those cases were against websites that used accessibility overlays or widgets.

Overlays create barriers for assistive technology

Most disabled people will use their preferred technology to get around the web.

Most disabled people will use their own technology when going online. This might be:

  • Screen reader
  • Zoom text
  • Browser plugins for coloured backgrounds or font size and type
  • Read&Write tool

Overlays can override these existing assistive technologies. They force your users to interact with a website in a specific way. This can cause a confusing and frustrating user experience. And can make the website more inaccessible to your customers with access needs.

Your whole website needs to be accessible to work with the equipment, tools and plugins people are already using. That’s on all websites, not just yours.

Overlays cannot replace good user design

Accessibility is about more than simply meeting WCAG guidelines. It’s about creating a good user experience for as many users as possible. Including those with access needs.

Artificial Intelligence (AI) cannot pick up or mend most issues that affect user experience (UX). For example, being able to navigate around the site and find the information you need quickly.

These issues are more complex and will vary depending on:

  • your website’s purpose (for example, to sell products or provide information)
  • your users’ needs

Without considering user experience, a website can be ineffective and unusable.

An accessibility overlay may be able to correct minor issues. But cannot make an unusable website perform.

Good user experience comes when you design for your user’s needs. If you genuinely want to make a website that works for all your users, you need to research and test with your users. And those users must include disabled people, too.

They don’t always work well on mobile

Most overlays and widgets are designed for desktop use only. They do not work well (if at all) on mobile browsers and apps.

And again, overlays can interfere with the mobile’s inbuilt accessibility tools that help people use their phone. Your website continues to be inaccessible if the overlay doesn’t work or interferes with the assistive features.

Overlays can damage your brand

Using an overlay suggests you’re not that invested in your disabled customers’ needs.

By using an overlay, you deprioritise accessibility. And when you deprioritise accessibility, you devalue your disabled customers.

There are 14.1 million disabled people in the UK, or 1 in 5 people. And when you consider disabled people’s friends and family, that number is even higher.

By excluding disabled people, you risk alienating a much larger audience.

Over time, this can have a negative impact on your brand. Would you continue using a website that actively excludes you? Would you want to buy from that company in the future? The answer is probably not.

When can an overlay help?

The main appeal of accessibility overlays is that they are quick, cheap and easy to set up. In some situations, they may be the only option. For example:

  • for small organisations with limited budgets
  • as a temporary solution before a website redesign
  • if your users are unlikely to be able to afford assistive technology

If you’re working on making your website WCAG compliant but you also have an overlay, consider if it’s actually helping your customer.

Many people will have tech or plugins that allow them to do the things your overlay does, but on every website. If you want to use an overlay, make sure your website works with people’s existing technology and plugins. This is really important.

Do research with your disabled customers to find out what they need, and the barriers they may face. This is always better than adding an overlay to your site and hoping it will fix it.

There’s no such thing as a ‘quick fix’ to accessibility. You have to put the work in to be inclusive. By doing so, you improve the experience for everyone, for all your customers.

More articles on accessibility overlays