# The Accessibility Baseline: 12 Fixes That Cover Most Complaints

_Published 2026-10-01 · Updated 2026-10-01 · Redesign vs Refresh · https://websitesupgrade.com/guides/accessibility-baseline/_

> The accessibility baseline for a business website is WCAG 2.2 level AA, and most real complaints cluster around the same dozen fixable problems — contrast, alt text, keyboard focus, form labels, and headings do most of the work. The caveat: an "accessibility overlay" widget is not a fix and does not satisfy the guidelines — the fixes below are to your actual markup and styles. First action: press Tab on your homepage and watch whether you can see where the focus goes; that single test tells you how much of this list you need.
> 

Somewhere in your inbox or your conscience is the word "accessibility" attached to your website — a complaint, a demand letter rumor, a government contract requirement, or just the growing awareness that a chunk of your visitors cannot use parts of the site. The anxiety comes from how big the topic sounds: WCAG has dozens of success criteria and reads like a treaty.

The reality for a small business site is much smaller. Most complaints — and most of what automated audits flag — trace to a dozen concrete problems. This guide gives you the 12 fixes, the WCAG 2.2 rule behind each (the [W3C quick reference](https://www.w3.org/WAI/WCAG22/quickref/) is the primary source), and a five-minute test for every one. If your site needs more than fixes, the [refresh-or-rebuild test](/guides/refresh-or-rebuild-test/) tells you where the line is.

## Reading the list

WCAG 2.2 organizes rules into levels: A (must), AA (the standard everyone means), AAA (aspirational). The baseline is **AA**. Each fix below names its success criterion — the SC number — so you can verify it in the quickref yourself instead of trusting a blog post (including this one).

## Fixes 1-4: what people see (or can't)

1. **Contrast that meets 4.5:1** (SC 1.4.3). Body text needs a 4.5:1 contrast ratio against its background; large text (18pt+, or 14pt bold) needs 3:1. The usual offenders: light-gray text on white, brand orange on white, text over photos. *Test:* paste your colors into the [WebAIM contrast checker](https://webaim.org/resources/contrastchecker/) — five minutes per color pair.
2. **Alt text on images that carry meaning** (SC 1.1.1). Every informative image needs an `alt` describing what it conveys; decorative images get empty `alt=""` so screen readers skip them. *Test:* run your homepage through a free checker like WAVE, or view source and count `img` tags missing `alt`.
3. **Text that survives zooming** (SC 1.4.4 and 1.4.10). Pages must allow 200% zoom, and at 320px width there must be no horizontal scrolling. *Test:* shrink the browser to a narrow window and zoom your homepage to 200% — anything requiring sideways scrolling or overlapping is a failure.
4. **No information by color alone** (SC 1.4.1). Required fields marked only in red, charts distinguished only by color, links only colored — all fail. *Test:* look at your error states and links in grayscale (or just ask "would I know this without the color?").

## Fixes 5-8: what people can operate

5. **A visible focus indicator** (SC 2.4.7). When you Tab through the page, you must be able to see which element is focused — a designer somewhere removed the "ugly outline" and broke keyboard navigation. *Test:* press Tab repeatedly on your homepage and watch for the focus ring; if you cannot see it, that is the single most common fix on this list.
6. **Everything works with keyboard alone** (SC 2.1.1, 2.1.2). Menus, dropdowns, modals, carousels, and forms must work without a mouse, and focus must never get trapped. *Test:* put the mouse aside and complete a real task — open the menu, fill the contact form, close a popup.
7. **Tap targets at least 24px** (SC 2.5.8, new in 2.2 AA). Buttons and links on mobile need roughly 24 CSS pixels of target size — tiny footer links and cramped nav items are the classic failures. *Test:* try the site on a real phone with your actual thumb, not your eyes.
8. **A skip link and sane focus order** (SC 2.4.1, 2.4.3). Keyboard users need a "skip to content" link and a tab order that matches the visual order. *Test:* load the page and press Tab once — a skip link should appear; keep tabbing and check the order follows the page, not the code's whims.

## Fixes 9-12: what people can understand

9. **Real form labels** (SC 3.3.2, 4.1.2). Every input needs a `<label>` tied to it — placeholder text is not a label (it vanishes when you type and many screen readers miss it). *Test:* click the visible label text; if the field doesn't focus, it isn't associated.
10. **Headings that actually nest** (SC 1.3.1, 2.4.6). One `<h1>` per page, then h2/h3 in order — headings chosen by font size produce an outline that reads as nonsense to screen-reader users who navigate by heading. *Test:* run your page through the W3C validator or a headings viewer and read the outline alone.
11. **Descriptive link text** (SC 2.4.4). "Click here" and "read more" are meaningless out of context; links should say where they go. *Test:* scan the page for link text that could work without its surroundings.
12. **Calm media** (SC 1.2.2, 2.2.2, 2.3.1). Prerecorded video needs captions; anything that moves, blinks, or auto-plays needs a pause/stop control; nothing flashes more than three times a second. *Test:* watch the homepage for five seconds — if something is moving and there is no way to stop it, that is the fix.

## The whole list on one card

| # | Fix | WCAG 2.2 | 5-minute test |
|---|---|---|---|
| 1 | Contrast ≥ 4.5:1 | 1.4.3 | WebAIM contrast checker |
| 2 | Alt text / `alt=""` | 1.1.1 | WAVE or view-source count |
| 3 | Zoom/reflow at 320px | 1.4.4, 1.4.10 | Narrow window + 200% zoom |
| 4 | Not color-only | 1.4.1 | Grayscale check |
| 5 | Visible focus | 2.4.7 | Tab through the page |
| 6 | Full keyboard access | 2.1.1, 2.1.2 | Do a task mouse-free |
| 7 | 24px tap targets | 2.5.8 | Real phone, real thumb |
| 8 | Skip link + focus order | 2.4.1, 2.4.3 | First Tab press reveals it |
| 9 | Form `<label>`s | 3.3.2, 4.1.2 | Click the label text |
| 10 | Heading hierarchy | 1.3.1, 2.4.6 | Read the outline |
| 11 | Descriptive links | 2.4.4 | "Click here" hunt |
| 12 | Captions, pause, no flash | 1.2.2, 2.2.2, 2.3.1 | Watch the homepage |

## What the baseline does not cover

Honesty about scope: these 12 fixes make most complaints go away and put a typical brochure site at or near AA, but they are not the whole standard. Complex widgets (date pickers, mega-menus, live chat), PDFs, e-commerce flows, and anything dynamic have their own criteria — SC 4.1.2 alone (name, role, value on every custom control) is where widget-heavy sites earn their audit bills. If your site sells, books, or has members, treat this list as step one and budget a professional audit as the second. The cost picture — DIY vs. contractor vs. agency — is mapped in our [upgrade cost guide](/guides/website-upgrade-cost/).

And the fixes are per-change, not per-launch: every template edit and plugin update can reintroduce a failure. The habit that keeps a site accessible is the same five-minute test list, run after each redesign — which is why the tests above are all things you can repeat yourself. More like this lives in the [guides index](/guides/).

— Editorial team. Facts current as of 2026; we revise guides when the ground shifts.

<!-- sources:
- https://www.w3.org/WAI/WCAG22/quickref/ (fetched 2026-09-29: WCAG 2.2 success criteria list — contrast 4.5:1 in 1.4.3, focus visible 2.4.7, target size 24px in 2.5.8 [new in 2.2], labels 3.3.2, captions 1.2.2, reflow 1.4.10, etc.)
- https://webaim.org/resources/contrastchecker/ (contrast test tool)
- Cost range consistent with /guides/website-upgrade-cost/ bands (refresh USD 750-3,500)
-->

## FAQ

**Is this legally required for a small business?**

It depends on your jurisdiction and sector — in Canada, AODA applies to Ontario organizations with 50+ employees, and various human-rights frameworks apply more broadly; the US sees demand letters under the ADA. The practical answer is that WCAG 2.2 AA is the reference standard courts and regulators point to, and the fixes below are cheap regardless of obligation.

**Does an accessibility overlay plugin fix this?**

No. Overlays add a toolbar on top of the same broken markup — they do not fix contrast, missing labels, or keyboard traps, and the accessibility community broadly regards them as ineffective. Fix the markup; it is usually less work than installing and paying for the overlay.

**How do I know when I'm done?**

When the 12 fixes are in and your own tests pass, run one automated pass (a Lighthouse accessibility audit or an axe scan) to catch stragglers, then re-test after any redesign. Accessibility is a property of the current build, not a one-time certificate — treat it like spelling, not like a foundation pour.

## Related

- https://websitesupgrade.com/guides/refresh-or-rebuild-test/
- https://websitesupgrade.com/guides/website-upgrade-cost/