Accessibility Standards Compliance Checklist

Pre-release WCAG 2.1 AA conformance review run by frontend engineering and QA before shipping a customer-facing build. Covers automated scans, manual keyboard and screen-reader testing, and remediation tracking against the four POUR prin...

Use this workflow
1

Audit Scope and Tooling

  1. Confirm WCAG conformance target

    • Most B2B SaaS targets WCAG 2.1 AA; public-sector and EU Accessibility Act contracts may require 2.2 AA. Document the target in the audit ticket so reviewers know which success criteria apply.

    Collects list Collects text
  2. Inventory pages and components in scope

    • List the user flows under review — sign-up, checkout, dashboard, settings, any flow behind a paywall — plus shared components (modal, datepicker, toast). Auditing the whole app is a common gotcha; pick representative pages and reusable components.

  3. Run axe-core and Lighthouse against staging

    • Use axe DevTools or @axe-core/playwright in CI plus Lighthouse accessibility audit. Automated tools catch ~30% of issues — they are the floor, not the ceiling. Export the JSON report and attach it for the remediation backlog.

    Collects file
2

Perceivable

  1. Verify alt text on all non-text content

    • Every <img> needs a meaningful alt; decorative images get alt="". SVG icons used as buttons need aria-label. Charts and complex graphics need a long description or data table fallback.

  2. Check captions and transcripts on media

    • Pre-recorded video needs captions (1.2.2) and audio description (1.2.5). Auto-generated YouTube captions do not meet AA — they need human review. Live audio needs captions at AA only if the audio is the primary content.

  3. Test color contrast ratios

    • Body text needs 4.5:1, large text (18pt+ or 14pt bold) needs 3:1, UI components and graphics need 3:1 (1.4.11). Disabled controls are exempt. Use Stark, Polypane, or the browser DevTools contrast checker — design-system tokens often fail in dark mode even when light mode passes.

  4. Verify content reflows at 320 CSS pixels

    • 1.4.10 Reflow requires no horizontal scrolling at 320px width or 400% zoom. Common failures: data tables, pricing grids, fixed-width modals. Test by zooming a 1280px browser to 400% rather than only resizing.

3

Operable

  1. Walk every flow with keyboard only

    • Unplug the mouse. Tab through sign-up, checkout, and the primary dashboard. Watch for keyboard traps in custom modals and datepickers, missing focus rings on custom buttons, and Tab order that doesn't match visual order. Skip-to-main-content link should appear on first Tab.

  2. Verify visible focus indicators

    • 2.4.7 requires a visible focus indicator on every interactive element. The most common regression is a designer setting outline: none without replacing it. Required contrast against the adjacent background is 3:1 (2.4.11 in WCAG 2.2).

  3. Test session timeouts and time limits

    • 2.2.1 requires user warning + extension option for any timeout under 20 hours. Auth session expiry, idle logout, and OTP timers are the usual offenders. Confirm the warning is announced to screen readers and dismissable from the keyboard.

  4. Check motion and flash thresholds

    • No content flashes more than 3 times per second (2.3.1). Honor prefers-reduced-motion for parallax, auto-playing carousels, and animated transitions. Loading spinners and confetti animations are common reduced-motion misses.

4

Understandable

  1. Verify lang attributes and reading level

    • <html lang="en"> on every page (3.1.1); inline language changes need lang on the element (3.1.2). Marketing pages often render localized content without setting the attribute, which breaks screen-reader pronunciation.

  2. Confirm consistent navigation across pages

    • 3.2.3 and 3.2.4 require nav, search, and identifying icons to be in the same place and labeled the same way across the site. Recently-shipped redesigns of single sections often violate this without anyone noticing.

  3. Test form validation and error messaging

    • 3.3.1 and 3.3.3 require errors to be identified in text (not color alone) and offer correction guidance. Each input needs a programmatic <label>, error messages need aria-describedby linking the field, and the error region should be a live region or receive focus on submit.

5

Robust and Assistive Technology Testing

  1. Validate semantic HTML and ARIA usage

    • Prefer native elements (<button>, <a>, <nav>) over <div role="button">. ARIA roles must match expected children — role="tablist" needs role="tab" children. First rule of ARIA: don't use ARIA when a native element will do.

  2. Test with NVDA, VoiceOver, and JAWS

    • NVDA + Firefox on Windows, VoiceOver + Safari on macOS, JAWS + Chrome covers ~90% of real users. Walk the same primary flow on each and listen for unannounced state changes (toast notifications, loading spinners, route transitions). Save recordings if findings are subtle.

    Collects file
  3. Decide whether blocking issues were found

    • Triage with the product owner: AA-blocking issues that affect a primary flow (sign-up, checkout, core task) gate the release. AA findings on secondary flows go on the backlog with target dates. AAA findings are tracked but don't block.

    Collects list
6

Remediation and Sign-Off

  1. File remediation tickets with WCAG references

    • Each ticket cites the success criterion (e.g., 1.4.3 Contrast Minimum), the affected component, and reproduction steps. Group fixes by component owner — fixing the shared Button component closes a dozen tickets at once.

  2. Re-test fixes against the original findings

    • Run the automated scan again and manually re-verify each blocking finding. A common regression: a contrast fix in light mode breaks dark mode, or an ARIA fix breaks the keyboard interaction.

  3. Update the VPAT or accessibility statement

    • If the team publishes a VPAT (ACR) or accessibility statement, update the conformance notes for any criteria whose status changed. Sales and procurement teams pull the latest VPAT for RFPs — stale documents lose deals.

  4. Sign off on the audit
    Collects list Collects paragraph Collects signature