Quality

Accessibility Audit Template

A template for conducting an accessibility audit and implementing fixes to ensure the application meets WCAG 2.1 AA standards. Covers keyboard navigation, screen reader support, color contrast, and ARIA attributes.

Template Preview

Copy and use in your project

Accessibility audit and fixes for [Page/Feature]

As a user with a disability, I want the application to be fully accessible so that I can use all features with my assistive technology (screen reader, keyboard, switch device) without barriers.

choreMEDIUM8 pts

Description

Conduct a thorough accessibility audit of [page/feature] and implement fixes to achieve WCAG 2.1 Level AA compliance. **Audit Checklist:** - Keyboard navigation: All interactive elements reachable and operable via keyboard - Screen reader: Correct heading hierarchy, ARIA labels, live regions for dynamic content - Color contrast: All text meets 4.5:1 contrast ratio (3:1 for large text) - Focus management: Visible focus indicators, logical tab order, focus trapping in modals - Forms: Labels associated with inputs, error messages announced, required fields indicated - Images: Alt text for meaningful images, decorative images hidden from assistive tech - Motion: Respect prefers-reduced-motion, no auto-playing animations **Tools:** axe-core, Lighthouse Accessibility, VoiceOver/NVDA manual testing

Acceptance Criteria

Given the accessibility fixes are implemented

When I run the axe-core accessibility scanner on the target pages

Then zero critical or serious accessibility violations are reported

Given I navigate the page using only the keyboard

When I tab through all interactive elements

Then every button, link, and form field is reachable with a visible focus indicator and a logical tab order

Given I use a screen reader (VoiceOver or NVDA)

When I navigate through the page

Then all content is announced correctly including headings, form labels, button purposes, and dynamic status updates via live regions

Given I have prefers-reduced-motion enabled in my OS settings

When the page renders and I interact with it

Then all animations are disabled or reduced to simple opacity/color transitions

Given the Lighthouse Accessibility audit is run

When the audit completes

Then the score is 95 or above

Import directly into Codepylot

Skip the copy-paste. Codepylot has built-in templates you can use with one click, plus AI that generates even richer stories from your ideas.

Try Codepylot Free

Other Templates

Ready to build your AI agent workforce?

Describe what you want. Your agents write the code. You stay in control.