Quick WCAG Audit

A fast accessibility check covering the highest-impact issues. Target time: under 1 hour.

For a comprehensive audit, see the full WCAG audit.

1. Run WAVE

Go to WAVE and paste the URL of the homepage, one content page, and any page with forms. WAVE scans for accessibility issues automatically. Focus on the errors (red icons) — you can ignore warnings for now.

Put your mouse aside and try using only the keyboard. Press Tab to move forward through the page and Shift + Tab to move back.

Can you reach all links, buttons, and form fields?
Can you always see which element is currently focused (there should be a visible outline)?
Do you get stuck anywhere and can’t tab away? That’s called a keyboard trap.

3. Heading Structure

Verify each page has exactly one h1 and that headings are used for structure rather than styling. You can check this by right-clicking → Inspect and looking at the HTML, or by using the HeadingsMap extension.

Enable VoiceOver (Cmd + F5 on Mac) and open the rotor (Ctrl + Option + U). The rotor is a menu that lists page elements by type. Cycle through:

Landmarks — the page should have identifiable regions (nav, main, footer, etc.)
Links — link names should be descriptive on their own (no “click here” or “read more”)
Headings — should reflect the page structure and read in a logical order

Also verify each page has a unique, descriptive <title> (shown in the browser tab) and that the <html lang> attribute matches the language of the page content. An incorrect lang causes screen readers to use the wrong pronunciation engine.

5. Image Alt Text

Images can have an alt attribute that describes them for screen readers and when images fail to load. Right-click an image → Inspect and check the <img> tag:

Meaningful images should have a descriptive alt (e.g. alt="Team photo at the office")
Decorative images (backgrounds, icons next to text) should have an empty alt="" so screen readers skip them

6. Color Contrast

Check that text is easy to read against its background using WebAIM’s Contrast Checker. Pick the text color and background color and it will tell you the ratio. Minimum ratios: 4.5:1 for normal text, 3:1 for large text (18px+ bold or 24px+ regular).

7. Form Labels

Every form input (text field, dropdown, checkbox) should have a visible label that describes what it’s for. Right-click → Inspect the input and check that it has an associated <label> element. Placeholder text alone is not enough — it disappears when the user starts typing.

UX Performance