Overlays Underwhelm: Web Directions AAA 2021

A collection of images, videos, tweets, articles, and links referenced in my talk for Web Directions AAA 2021. This may not make much sense if you did not attend the talk. Or even if you did.

Intro

I had the title before I had the content. I tried to shoehorn this over / under theme into the talk. Maybe not my best idea.

Slide 2: Tim Berners-Lee

The actual Tim Berners-Lee quote:

The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.

The gag is that this quote is used in so many intro accessibility talks that it has become an unfortunate cliché. Which is why I used Patrick Lauke’s and Bruce Lawson’s Tim Berners-Lee Quote’o’matic fictitious quote generator.

Overview Understated

What is an overlay? A tool that provides some sort of accessibility or usability feature that may not be built into the underlying site; sometimes it replicates native features and sometimes it offers some other affordance.

Slide 5: Browsealoud

As you can see, it offers no context for what is being read, visible or not. It was never meant to replicate screen readers. Instead it is akin to a feature you can find built in to browsers today, such as Edge’s Immersive Reader.

Announcement of the Browsealoud rebrand, and more info on the crypto-jacking of the Browsealoud script.

Slide 7: Text Resize Widget

Annoted demonstration of the New York Times text resizing widget using Edge 14. I did not choose Edge because it behaved any worse or better in that browser. The bullet list preceding this video is the description of what is happening.

Originally from my 2016 post Don’t Re-Create Browser Features.

Slide 9: Hand Talk

Hand Talk presents the content of the page in sign language. To its credit, it is not finger spelling everything it encounters.

Hand Talk’s post announcing version 4.0.

Overstate Underperform

Overlays tend to overstate their abilities. In technical reviews, they consistently underperform.

Slide 13: accessiBe versus Axe

Axe showing 4 violations before running the accessiBe overlay on the AI page. Axe showing 12 violations after running the accessiBe overlay on the AI page.
Running Deque’s Axe browser plug-in reveals more WCAG violations after enabling the accessiBe overlay, from 4 to 12.

Slide 14: accessiBe versus ARC Toolkit

ARC showing 19 violations before running the accessiBe overlay on the AI page. ARC showing 38 violations after running the accessiBe overlay on the AI page.
The Paciello Group’s ARC browser plug-in also shows a jump from 19 violations to 38 after running the accessiBe overlay.

Slide 15: accessiBe versus WAVE

WAVE showing 0 violations before running the accessiBe overlay on the AI page. WAVE showing 0 violations after running the accessiBe overlay on the AI page.
WebAIM’s WAVE checker browser plug-in returned no violations aside from a single contrast violation. These results are not surprising given it may be spoofing WAVE and I get the WAVE warning when I use the bookmarklet.

Slide 17: MaxAccess and its Failure to Stop

The ‘Stop Animations’ button on this overlay fails to stop the auto-playing background video. To compound the confusion, the button changes only its accessible name when pressed. It does not use aria-pressed to indicate it has been activated.

See the unstoppable background video in action at the bottom of this page.

Slide 18: EqualWeb Traps Keyboards

I tried the keyboard navigation feature of one vendor. Even after I activate the feature, focus styles are still missing. Eventually a new box appears, with different links. I was tabbing so much already I tabbed past the item that displayed the instructions. To drive home the point, it drops me into a de facto keyboard trap in its cookie pop-up.

You can try your luck at the vendor’s home page.

Slide 20: When the Overlay Itself Violates WCAG

4 views of the overlay, each one has white text on a light gray background and hover styles that are minor changes in size.
The overlay is long, so this image captures 4 screenfuls. The screen shot is from Chrome 87 on Windows, a common browser, though it behaves this way across browsers. The image is a link to a larger file where you can try to guess over which control I am hovering.

You can visit the example site, Aquis.com, and try it for yourself.

Slide 21: When the Overlay Itself Violates WCAG, Proof

A color contrast analyzer showing the white text against the very light peach background has a contrast ratio of 1.2:1.

This uses the Colour Contrast Analyser.

Slide 22: When Declining the Overlay Breaks the Page

The video shows the browser default focus ring, then the alert prompting the user to enable the overlay at :09. When declined, from :12 forward you can only tell that focus is changing by looking at the browser status bar.

Slide 23: When the Overlay Keeps Selling

Navigating to the Lawsuits page of the AccessUS web site. The page gets a gray overlay, and then audio starts to play with no visible video player or audio controls.

Give it a shot yourself at the AccessUS site, and maybe get startled by the hidden voices.

Slide 25: Overlay Guarantees

Does accessiBe protect me from lawsuits? Absolutely! accessiBe turns inaccessible websites into WCAG and ADA compliant websites. But not only that, accessiBe provides you with a Litigation Support Package, in case you need to prove your ADA website compliance, and guides you through the process. Does accessiBe cover all accessibility requirements? Yes! accessiBe covers the WCAG (Web Content Accessibility Guidelines) version 2.1 at the AA level success criteria, and in certain areas even level AAA. This is a step beyond what legislation requires.
accessiBe home page, captured 6 February 2021.

Slide 26: Reality of Overlay Guarantees

From the accessiBe Terms: "Standard" means WCAG 2.1 level AA success criteria.
accessiBe Terms of Service, captured 30 March 2021, dated 14 December 2020.

Slide 27: More Reality of Overlay Guarantees

From the accessiBe Terms: The functionality of the accessiBe Systems requires that the Licensee Website in which they are embedded be websites based solely on HTML files and tags, and that the source code be written according to the Standard of the World Wide Web Consortium (“W3C”), without any errors or validation warning in W3C’s troubleshooting inspections; please note that Licensee changes to such website may impact the functionality of the Service. By way of example, accessiBe Systems do not support other components, such as Canvas, Flash and/or SVG.
accessiBe Terms of Service, captured 30 March 2021, dated 14 December 2020.

Slide 28: Just a Few Overlay White Lies

UserWay list of claims. Compliance: Makes your site ADA compliant. Lawsuits: 0 lawsuits mentioning UserWay’s AI Solution. Reputation: Strong reputation with the disabled community. Privacy: Privacy by design, data minimization. Security: Privacy preserving, does not track user types/identify people with disabilites [sic].
UserWay vs accessiBe, captured 9 September 2021.

Slide 30: Lawsuits Naming Overlays

Page 13 of Blair Douglass v. Masterbuilt Manufacturing, LLC Page 14 of Murphy v Eyebobs complaint Page 7 of Fischler v Dorai Homes complaint Defendant’s online store includes an “accessibility widget” which shoppers may allegedly use to enhance their user experience. The widget supposedly helps shoppers increase color contrast, highlight links, and stop animations, among other things. To use the widget, shoppers must activate, or “click,” a floating button on the right side of the Website. Once activated, Defendant displays a pop-up window. Shoppers who perceive content visually can click the pop-up window to activate the widget’s various tools. Unfortunately, the Website does not alert Plaintiffs’ screen readers when this pop-up window appears. Instead, their screen readers remain locked on the Website’s underlying page, making it impossible for them to use the “accessibility widget” independently. Defendant’s online store includes an “accessibility widget” which shoppers may allegedly use to enhance their user experience. The widget supposedly helps shoppers adjust font and emphasize titles, among other things. To use the widget, shoppers must activate, or “click,” a floating button on the right side of the Website. Once activated, Defendant displays a pop-up window. Shoppers who perceive content visually can click the pop-up window to activate the widget’s various tools. Unfortunately, the Website does not alert Plaintiffs’ screen readers when this pop-up window appears. Instead, their screen readers remain locked on the Website’s underlying page, making it impossible for them to use the “accessibility widget” independently and thereby defeating its purpose.

Since I recorded this talk, the Eyebobs case has concluded with a settlement. Eyebobs has to create an accessibility team, perform an audit, adopt a policy statement, implement an accessibility strategy, and provide accessibility training. In short, the overlay not only failed to protect Eyebobs, it seemed to work against Eyebobs.

Slide 32: Overlays Sometimes Fail to Load

Firefox dev tools showing the link and raw HTML along with a script error that the widget was not initialized.
The browser is showing it cannot load the script, and the trigger to load the accessiBe overlay is a <div> with a tabindex and a button role.

Slide 33: Overlays as Malware

On July 27, 2020, Nycanuck said: I am trying to determine if the blocking of acsbap.com is legitimate. It looks like this may be a tracking service and is used by a number of vendors. Below is the block. Malware Bytes staff responds: Hello, thanks for bringing this to our attention. We've reviewed the site again and have determined it no longer warrants being blocked so we've removed it from our database. Removal should be reflected in the next database update going out in a few hours or so.

The forum entry.

Slide 35: Dodging Data Protection

Also from Léonie’s post AccessiBe and data protection?.

Overpromise Underdeliver

Overlays will over-promise in their marketing, making claims about their utility and popularity while under-delivering on them.

Slide 38: Villainizing

Cartoon. A man at a computer happily exclaims, "Finally, my website is up!" Two men in suits appear next to him holding legal papers and say, "Not so fast! Nice website, but it's not accessible! You've been served." Shows the man again, crying, hands up in the air, saying, "I'm broke now. Why bother?" In the background the two men can be seen walking away carrying bags of money.
The accessiBe LinkedIn post where this first appeared in May 2021 and, after getting some push back, removed and disabled comments.

Slide 39: Silent Majority

Slide 40: WordPress Ban

Headline on WP Tavern: WordPress.org Removes Fake Reviews for AccessiBe Plugin
WordPress.org Removes Fake Reviews for AccessiBe Plugin, February 18, 2021

Slide 42: NBC News

NBC News: Blind people, advocates slam company claiming to make websites ADA compliant. “If you have a website, do you want to include disabled people or do you want to exclude them? That’s why it's a civil right,” one expert said.
Blind people, advocates slam company claiming to make websites ADA compliant, May 9, 2021

Slide 43: Vice

Vice, Motherboard headline: People With Disabilities Say This AI Tool Is Making the Web Worse for Them AccessiBe aims to make the internet fully accessible to the visually impaired by 2025—but activists say the company's AI is making things worse.
People With Disabilities Say This AI Tool Is Making the Web Worse for Them, March 17, 2021

Slide 44: Mosen at Large

Mosen at Large: Episode 105: The AccessiBe controversy. Can AI make the web fully accessible in a few short years, or might it make matters worse?
Episode 105: The AccessiBe controversy. Can AI make the web fully accessible in a few short years, or might it make matters worse?, March 14, 2021

Slide 45: Overlay Blockers

accessibegone. Instructions for blocking AccessiBe and similar intrusive overlays. Chrome Web Store: AccessiByeBye from Pneuma Solutions.
AccessiBeGone and AccessiByeBye

Slide 46: FACIL'iti and Frivolous Lawsuits

A view of the first two pages of the Mise en demeure from FACIL'iti to Koena demanding critical tweets be removed.
In April, FACIL’iti’s attorneys started sending letters demanding removal of any criticism. This letter to Koena shows two tweets about FACIL’iti.

Koena writes about the referenced demand letter in Koena mise en demeure par FACIL’iti. Another frivolous suit is outlined in Aide pour mes frais d’avocate dans mon procès contre FACIL’iti, which is also available in English.

15 November 2021: Koena has provided an update in Procès FACIL’iti : conclusions de Koena déposées le 12 novembre 2021.

Slide 48: National Federation of the Blind

National Federation of the Blind, press release dated June 24, 2021: National Convention Sponsorship Statement Regarding accessiBe

The full NFB press release.

Slide 49: CSUN Conference on Disabilities

Slide 50: We The 15

Slide 52: Overlay Fact Sheet

The Overlay Fact Sheet site showing the table of contents.

Visit the Overlay Fact Sheet and consider signing.

Overnight Undertake

Overlays cannot make your site, or your brand, better overnight. There are some steps you can undertake, however.

Slide 54: Plan Ahead

Slide 55: If You Already Have a Site

No comments? Be the first!

Leave a Comment or Response

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>