Skip to content
NEWAI search optimizationSee how

Accessibility

Is your website ADA compliant? How to check today

Website accessibility lawsuits keep rising. What WCAG 2.2 AA actually requires, the five failures that cause most of them, and how to test your own site today.

Bizup LLC

Seattle web design, development and SEO studio

9 min read

ADA & WCAG accessibility

Most businesses find out their website is inaccessible the same way: a demand letter arrives. It names a page, cites the Americans with Disabilities Act, and offers to settle. By then the cheapest moment to have fixed it — before the site was built — is years gone.

The good news is that website accessibility is not mysterious. There is a published standard, WCAG 2.2 Level AA, that US courts and the Department of Justice both treat as the practical benchmark. Most of what it asks for is unglamorous and cheap, and you can check the worst of it yourself this afternoon.

Accessibility is not a feature you add at the end. It is a set of decisions you either made correctly while building, or pay a lawyer to explain later.
Bizup LLC

What ADA compliance means for a website

The ADA itself says nothing about websites — it predates them. What has happened instead is that courts have repeatedly held that a business's website is a place of public accommodation under Title III, and that an inaccessible one discriminates against disabled customers.

Because the statute gives no technical specification, judgments and settlements lean on WCAG, the Web Content Accessibility Guidelines. Level AA is the level almost always named. It is not law in the way a building code is law, but it is the yardstick you will be measured against, so it is the one worth building to.

The five failures behind most complaints

Accessibility audits turn up dozens of issues on a typical site, but a small number account for the majority of real-world complaints. In rough order of how often we find them:

1. Images without alternative text

A screen reader announces an image by its alt attribute. With no alt, it reads the filename — IMG_4471.jpg — which tells a blind visitor nothing. Decorative images should carry an empty alt so they are skipped; meaningful ones need a description of what they convey, not of what they depict.

2. Colour contrast below the threshold

WCAG AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text and interface components. Light grey placeholder text, pale text over photographs, and brand colours used at small sizes are the usual culprits. This is the single most common automated failure and also the easiest to fix.

Contrast ratios you will meet in the wild

Contrast ratio against the background · higher is better

#999 on white2.85fails
#767676 on white4.54passes AA
#595959 on white7passes AAA
White on #0C7C595.1passes AA
White on #25D3661.9fails badly

The last row is WhatsApp's own brand green with white text — a combination used on thousands of business sites, and one that fails even the relaxed 3:1 threshold for large text.

3. Forms you cannot complete with a keyboard

Try it now: load your contact page and press Tab repeatedly. You should see a clearly visible outline move through every field and button, in a sensible order, and be able to submit the form without touching the mouse. Custom dropdowns, date pickers and modal dialogs are where this usually breaks.

4. Labels that do not match what is on screen

A button that reads “Send” but carries an aria-label of “Submit contact form” breaks WCAG 2.5.3, Label in Name. It matters for speech-input users: somebody saying “click Send” gets nothing, because the accessible name does not contain the visible word. The fix is to make the accessible name start with the visible text.

5. Tap targets too small to hit

WCAG 2.2 added Target Size (2.5.8) at Level AA: interactive elements should be at least 24 by 24 CSS pixels, with exceptions. Icon-only social links in footers fail this constantly, as do closely stacked links in mobile menus.

How to test your own site this afternoon

You do not need to buy anything to find the majority of problems.

  1. Run an automated scan. Open Chrome DevTools, go to Lighthouse, and run the Accessibility audit. Or install the free axe DevTools extension, which gives clearer explanations. This catches roughly a third of issues.
  2. Unplug your mouse. Navigate your most important page — usually contact — using only Tab, Shift+Tab, Enter and Space. If you get stuck, or lose track of where focus is, so will a keyboard user.
  3. Zoom to 200%. Browsers must support this without horizontal scrolling or content disappearing. Set your browser zoom to 200% and reload.
  4. Turn the images off. In DevTools, block image requests and reload. What is left should still make sense. If a page becomes meaningless, your alt text is doing no work.
  5. Listen to it. macOS has VoiceOver (Cmd+F5), Windows has Narrator (Ctrl+Win+Enter). Ten minutes with either is more instructive than any report.

Overlay widgets will not save you

You have probably seen the sales pitch: one line of JavaScript, instant compliance, a little accessibility icon in the corner. These overlays do not work, and buying one can make your position worse rather than better.

They cannot fix missing alt text, because they do not know what is in your images. They cannot fix a form with no labels. They frequently interfere with the screen readers disabled visitors already use. In 2021 more than 700 accessibility practitioners, many of them disabled, signed an open letter recommending against them, and overlay vendors have themselves been the subject of ADA complaints.

If a product promises compliance for a monthly fee and no change to your website, it is not selling accessibility. It is selling the feeling of having dealt with it.
Bizup LLC

What it costs to do properly

On a site being built new, accessibility costs almost nothing — it is a set of choices about markup, colour and focus that a competent developer makes anyway. Retrofitting an existing site costs real money, and how much depends entirely on what it was built with.

  • A hand-built site is usually a few days of work: contrast, labels, focus order, alt text.
  • A page-builder site is harder, because the markup the builder emits is often not yours to change. See the real cost of a page builder for why that constraint shows up everywhere.
  • A site with a custom booking or checkout flow needs those flows tested individually, because that is where the complaints come from.

We publish what this work costs on our pricing page, and we include an accessibility pass in every build rather than selling it as an upgrade. If you would like us to look at your current site first, the free website audit covers accessibility alongside speed and search.

Frequently asked

Does my small business really need this?

Title III applies to places of public accommodation regardless of size. Small businesses receive demand letters routinely — in many cases more often than large ones, because they are less likely to have the site tested and more likely to settle quickly.

Is a Lighthouse score of 100 enough?

No. It means you have passed the automated checks, which are a minority of the standard. It is a useful floor and a misleading ceiling.

What about WCAG 2.2 versus 2.1?

2.2 is the current recommendation and adds a handful of criteria, Target Size among them. Building to 2.2 AA covers 2.1 AA, so there is no reason to target the older version on a new project.

Comments

Loading…

Leave a comment

Read before it appears, so it will not show up straight away. Your email is not published — it is only so we can reply to you directly.

Keep reading

More onAccessibility

All insights
Conversion

9 min read

Landing pages that earn their ad spend

Sending paid traffic to your homepage wastes most of it. What a landing page needs, what it must not have, and how to tell whether it is working.

Read the article