Should I use an accessibility overlay?

The simple answer to this question is, no, you shouldn’t use an accessibility overlay or widget. The main reason not to use an overlay is because they don’t make your site accessible. The only true way of making a website accessible is through testing. Accessibility overlays may, ironically, make your site less accessible and more vulnerable to lawsuits.

What are Accessibility Overlays

Accessibility overlays or widgets are third party scripts or code that are added to your website. The makers of the scripts claim that they make your website accessible automatically. They will detect if the website visitor is using a device such as a screen reader on the website and will attempt to fix that experience based on the device. So, it could disable other scripts from running if a person is using a screen reader. They may also add other functionality such as the ability to increase font-size and/or automatically adding alternative text to images.

Overlays Do Not Automatically Fix All Problems

I recently reviewed a prospect’s website (it’s what I do) and I saw they were using an accessibility overlay. You can easily tell when someone is using an accessibility overlay because they will usually have a small popup on one of the corners of the screen with either a wheelchair icon or an icon somewhat in the shape of a person.

When I reviewed the site, I quickly saw that in some portions of their site they had light gray text on a white background. I knew from experience that these colors did not provide enough contrast to meet the WCAG 2.0 standards. I tested it anyway to make sure and the results confirmed my expectation.

To state the obvious, the site was not accessible – it did not pass WCAG 2.0 standards. Accessibility overlays do not automatically increase color contrast, they do not automatically increase font size for everyone, and they do not add appropriate alternative text to images. Overlays do not make your website accessible; they add a way that people can access if they take a few extra steps after arriving at your site.

Automatically adding alternative text (alt-text) is something that cannot be done accurately. Even the best artificial intelligence cannot properly and relevantly describe an image. In some cases I’ve seen websites add alternative text programmatically based on image titles. So if a user adds an image from their phone without first renaming it, you can get meaningless alt-text such as “IMG3820”. Not helpful at all.

Equal Access is important

The Americans with Disabilities Act (ADA) requires equal access to goods and services. If an establishment such as a restaurant makes people with wheelchairs come in through the back door only, that is not equal access. The visitors on your website shouldn’t have to push extra buttons to be able to consume your content.

Don’t remind people that they have a disability

For a person with some form of color blindness to be able to view improperly colored text properly, they would first have to know that they can click on the accessibility button to increase the contrast. About one in twelve men and one in two hundred women have some form of color blindness. Unless you are very close to them on a personal level, you will probably never know that a person is color blind. They themselves may have gone through the first few years of life without knowing that they couldn’t see something that somebody else could. Do you really want to remind them that their vision is not equal to everyone else?

Make the website easier for everyone

Having an accessible website can make a website easier to use for everyone. Improper color contrast and font-size can cause eye-strain and wear out the reader. So even people with optimal vision will consume less of your content. Do you know anyone that wears glasses? Then you are probably aware that they don’t have their glasses on all the time. Larger font size might increase the chance that person would be able to read your content without having to remember where they left their glasses. Some people prefer to use keyboard navigation, not because they need to, but because they feel it is faster.

Making changes that make your website accessible are sometimes very easy

If you build a website from the beginning with accessibility in mind, there is very little, if any change in the amount of time it takes to build a website. If you are using pre-made templates, the developer or designer who made the template, probably considered accessibility (if they are any good) when they made it. Most of the time you just have to make choices (such as color) that won’t negatively affect accessibility.

If you use WordPress you should start with an Accessibility-Ready theme.

If you have a website that is already built, look for common problems on your website that could negatively affect accessibility. You could also run some tests using tools such as the WAVE Web Accessibility Evaluation Tools.

Make sure to:

Use colors that have proper contrast
Use an easy to read font
Use proper font-size – usually at least 16 px
Add appropriate alternative text to all images

Overlays add waiting time

There are a lot of statistics on how the speed of your website affects your conversion rate. Some of them state how shaving mere milliseconds can help you convert more. Imagine now that in order for a website visitor to start reading or shopping, they now have to click on a button and adjust some settings before they can even start the experience! With so many options available, that person is going elsewhere. If the risk of lawsuits doesn’t bother you, the risk of losing customers is something that should keep you up at night. Did I mention that 1 in 12 men are color blind! And it is one of the most common problems on websites.

I have heard claims from accessibility overlay companies that you can make your website accessible with a line of code added to your website (or something similar). That little bit of code is just there to import a larger amount of code. This can slow down your website which can affect your search engine optimization (SEO).

Conclusion

We don’t recommend using an accessibility overlay because we feel that most elements on a website can be made accessible easily. Especially if accessibility was a consideration when the website was built. Features on websites that are common culprits (such as sliders, pop-ups, or animations) are usually unnecessary and ineffective. Removing them can help give your users a faster and better experience. If your website is accessible, then why do you need an overlay?

For more information on this topic please visit the following links:

We love helping people improve the accessibility of websites and making them search engine friendly. Have a project we can help you on?