In today’s world of technology, accessibility is a must-have for website design. Web creators should plan to create a site that works for everybody, including people with disabilities. This can be achieved through text-to-speech features, closed captioning, or an adjustment bar for how a website is presented.

The goal is to design a website that reaches as many people as possible by meeting standards set by the ADA and the WCAG. To increase accessibility, web creators will often look to include overlays, widgets, and other tools that specialize in certain tasks. Although this may sound like a good idea for developing a userbase, adding an overlay has its downsides. To create better accessibility, you can find better tools outside of the overlay. 

Interested in creating a more accessible website? Reach out to us today. 


What Is an Accessibility Overlay?

In terms of web design, an overlay is a feature that adds a content box or a popup window to the site. An overlay can display different forms of content, most notably toolbars, widget bars, or a process for logging in or signing up. Accessibility overlays have gained popularity in recent years, with many wanting to use the overlay format to provide a separate menu for accessibility tools. However, with the way vendors are currently designing their products, many contemporary overlays cannot fully meet the standards set by the ADA or the WCAG. We’ll be getting into that later.

What Is an Accessibility Widget?

It’s commonplace to find accessibility tools using widgets – simplistic software applications used for automated tasks. These overlay widgets can serve several functions, most notably the following:

  • Changing the font, size, and color of a text
  • Changing the page’s contrast or background settings
  • Features for text-to-audio reading
  • Volume control
  • Closed captioning
  • Language translation

While the inclusion of widgets may seem beneficial for the most part, there are some major drawbacks to using widgets and overlays:

  • Many of the site’s widgets can already be found on the user’s computer, especially if the user already has a screen reader.
  • Computer-based tools often run more efficiently than website overlays because these tools are designed to meet the needs of the userbase.
  • Online widgets are often limited in terms of customization; an overlay won’t have as many choices for adjustment.
  • Widgets can also clutter the screen with unnecessary visuals, making the content disorientating to navigate; essentially, the more widgets you add to the website, the more likely the site can be slowed down in performance.

Why Designers Avoid Overlays?

Overlays tend to be cheap and easy to implement, so many web designers are tempted to purchase them as a quick fix for accessibility. However, if you’re truly looking to maximize accessibility, you should ask the designer to avoid using an overlay.

An overlay isn’t a good solution for these functions. Those with a screen reader find it difficult to move through a web page with an accessibility overlay. The overlay box is cumbersome or irritating for many users to deal with. You don’t want to frustrate the user by interfering with their ability to move through the main page’s content. If you consider the overlay’s content essential, consider adding the content to the main page rather than sequestering it into an overlay window. 

There’s also the issue of automation. Many overlay products rely heavily on automative features, particularly text alternatives, language translation, closed captioning, and automated repair. Automated add-ons aren’t as robust at fixing issues such as:

  • Unlabeled fields
  • Error prevention 
  • Keyboard functions
  • Misidentified language
  • A lack of alt text
  • Ambiguous text links
  • Missing links
  • Slow loading pages

It takes human-guided support to make these repairs, as automation is often ineffective at solving these problems. Many overlays can’t repair content files in Flash, Java, Silverlight, PDFT, or HTML5 Canvas. For disabled users, like blind people, it may be more difficult to access certain features, especially if they’re in a small icon or a side popup window. 

Should You Get an Overlay?

No, it’s not recommended. For many vendors, the overlay features are designed to be temporary fixes rather than long-term solutions. Part of that is due to the overlays scrubbing the user-facing code rather than doing a deep dive into the source code. With tailor-made web design customization, you’re more likely to get coding that goes deeper into addressing accessibility.

Further reading and resources:

  1. Information and Technical Assistance on the Americans with Disabilities Act
  2. WCAG 2 Overview
  3. 10 Tools to Evaluate the Accessibility of Your Website
  4. Designing for Screen Readers
  5. Overlay Fact Sheet