accessibility-pass

# accessibility-pass Check someone's live site against how people actually use the web: on bright screens, without a mouse, with screen readers, with imperfect vision. Most fixes are small; the skill is finding them systematically instead of assuming the site is fine because it looks fine to its author. ## Run the tools 1. Run a Lighthouse accessibility audit (Chrome DevTools, same panel as make-it-fast) on every page. It catches the machine-checkable layer: contrast failures, missing alt, missing labels, missing `lang`. Save the score as the "before". 2. axe DevTools, the free browser extension, on the worst page — it explains each finding better and catches things Lighthouse skips. One page is enough to learn the failure patterns. 3. The tools stop at what machines can check, so add two human tests: put the phone at arm's length in daylight and try to read it, and do the keyboard test below. ## Fix what turned up Work through findings with them making the calls; each fix is a one-line explanation. - Contrast: every flagged text/background pair gets checked in the WebAIM contrast checker and nudged until it passes 4.5:1 (3:1 for large text). They pick the new shade — darkening the text usually keeps the design intact. - Alt text: every meaningful image gets a description of what it shows, written by them, since they know why the image is there. Purely decorative images get `alt=""` so screen readers skip them. - Keyboard: unplug the mouse. Tab through the whole page — every link and button reachable, in an order that makes sense, with a visible focus outline. If focus vanishes, someone styled `outline: none`; restore it or style a better one. - Labels and structure: every input has a `<label>` (forms-that-work does this from the start), the page has one h1 and ordered headings (shared work with seo-basics), links say where they go — "see the project" beats "click here". Automated tools cannot prove that a site is accessible. Treat their findings as a repeatable first pass and record what was checked manually. ## Done - Before/after reports saved, with every critical or serious automated finding resolved or documented with a reason - Full keyboard run-through works with visible focus throughout - Labels, heading order, image alternatives, and contrast checked manually - They can name the two or three things they will now do by default in everything they build next That last point is the real product: the next site they build with build-website should not need this pass.