Accessibility work I do on every project, in order of payoff

An accessibility audit at the end of a project produces a list of forty items and a negotiation about which ones get fixed. Doing these from the start produces a site that mostly passes.

Ranked by payoff per hour.

1. Use the right element

A button that is a div with an onClick is the single most common failure I find, and it breaks keyboard access, screen readers and the browser's own focus handling in one go. Native button, a, label, input, details. Free behaviour you would otherwise reimplement badly.

2. Label every input, visibly

Placeholder text is not a label: it disappears when you type, fails contrast in most designs, and is not reliably announced. A visible label tied by htmlFor costs nothing and helps everyone, not just screen-reader users.

3. Keep a visible focus ring

Someone removes the default outline because it looks untidy, and keyboard navigation becomes a guessing game. Style it instead:

:focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: 2px;
}

4. Check contrast while designing, not after

AA is 4.5:1 for body text, 3:1 for large text and UI components. Catching it in the design file costs minutes; catching it after the component library is built costs a redesign.

5. Announce what changed

When a filter updates a result list, a sighted user sees it. Everyone else needs aria-live="polite" on a short status region: "24 results". One line.

6. Then test with a screen reader

Thirty minutes with NVDA or VoiceOver on your two main flows will find things no automated tool reports. It is uncomfortable the first time and routine by the third.

Automated tools catch perhaps a third of real issues. The list above is most of the rest, and none of it is slow once it is habit.