Accessibility Audit

Project: {{PROJECT_NAME}} Version: {{VERSION}} Date: {{DATE}} Author: {{AUTHOR}} Status: Draft | In Review | Approved Reviewers: {{REVIEWERS}}

Document History

Version	Date	Author	Changes
0.1	{{DATE}}	{{AUTHOR}}	Initial draft

1. Compliance Target

Standard	Level	Notes
WCAG 2.1	AA	Minimum required
WCAG 2.1	AAA	Target for critical flows (checkout, forms)
EN 301 549	Applicable	If serving EU public sector
Section 508	`{{Yes/No}}`	If US federal contract

Audit date: {{DATE}} Auditor: {{NAME}} Next scheduled audit: {{DATE}}

2. Audit Methodology

2.1 Automated Testing

axe-core: Integrated in Storybook + CI (via @axe-core/playwright)
Lighthouse: Accessibility score tracked in CI (target: ≥ 95)
pa11y: Run on full page URLs in staging environment

2.2 Manual Testing

Keyboard-only navigation on all critical user flows
Screen reader testing (see matrix in Section 6)
Zoom test: 200% browser zoom — no loss of content or functionality
Reflow test: 320px viewport width

2.3 User Testing

{{Yes — included users with disabilities in user testing | No — planned for future}}: {{Notes}}

3. Perceivable

1.1 Text Alternatives

Criterion	Status	Notes	Issue Ref
1.1.1 Non-text Content (A)	`{{Pass}}`	All `<img>` have `alt`; decorative images use `alt=""`

Checklist:

All <img> elements have descriptive alt text or alt=""
Icon buttons have aria-label
Complex images (charts, diagrams) have long descriptions
CAPTCHAs have audio alternative
SVG icons: meaningful → role="img" aria-label="...", decorative → aria-hidden="true"

TODO: Run axe and list all violations.

1.2 Time-based Media

Criterion	Status	Notes	Issue Ref
1.2.1 Audio-only / Video-only (A)	`{{Pass/Fail/N/A}}`
1.2.2 Captions (A)	`{{Pass/Fail/N/A}}`
1.2.3 Audio Description (A)	`{{Pass/Fail/N/A}}`
1.2.4 Captions Live (AA)	`{{Pass/Fail/N/A}}`
1.2.5 Audio Description Prerecorded (AA)	`{{Pass/Fail/N/A}}`

TODO: Audit all video/audio content on the platform.

1.3 Adaptable

Criterion	Status	Notes
1.3.1 Info and Relationships (A)	`{{Pass/Fail}}`	Semantic HTML for tables, lists, headings
1.3.2 Meaningful Sequence (A)	`{{Pass/Fail}}`	DOM order matches visual order
1.3.3 Sensory Characteristics (A)	`{{Pass/Fail}}`	No "click the red button" instructions
1.3.4 Orientation (AA)	`{{Pass/Fail}}`	No locked orientation
1.3.5 Identify Input Purpose (AA)	`{{Pass/Fail}}`	`autocomplete` on all personal data fields

Checklist:

Tables use <th> with scope attributes
Heading hierarchy is logical (H1 → H2 → H3, no skipped levels)
Lists use <ul> / <ol> — not styled <div>
Form inputs have autocomplete attributes for name, email, phone, address

1.4 Distinguishable

Criterion	Status	Notes
1.4.1 Use of Color (A)	`{{Pass/Fail}}`	Color not sole differentiator
1.4.2 Audio Control (A)	`{{Pass/Fail}}`	Auto-play audio has stop mechanism
1.4.3 Contrast Minimum (AA)	`{{Pass/Fail}}`	See contrast table below
1.4.4 Resize Text (AA)	`{{Pass/Fail}}`	200% zoom — no content loss
1.4.5 Images of Text (AA)	`{{Pass/Fail}}`	Real text used, not images
1.4.10 Reflow (AA)	`{{Pass/Fail}}`	320px width — no horizontal scroll
1.4.11 Non-text Contrast (AA)	`{{Pass/Fail}}`	UI components 3:1 ratio
1.4.12 Text Spacing (AA)	`{{Pass/Fail}}`	Custom spacing doesn't break layout
1.4.13 Content on Hover/Focus (AA)	`{{Pass/Fail}}`	Tooltips can be hovered/dismissed

4. Operable

2.1 Keyboard Accessible

Criterion	Status	Notes
2.1.1 Keyboard (A)	`{{Pass/Fail}}`	All functionality keyboard-operable
2.1.2 No Keyboard Trap (A)	`{{Pass/Fail}}`	Focus can always be moved away
2.1.4 Character Key Shortcuts (A)	`{{Pass/Fail}}`	Single-key shortcuts can be disabled

Checklist:

All interactive elements reachable by Tab key
All actions triggerable by Enter/Space
No keyboard traps (except intentional: modal focus trap with Escape exit)
Custom widgets follow ARIA Authoring Practices patterns

2.2 Enough Time

Criterion	Status	Notes
2.2.1 Timing Adjustable (A)	`{{Pass/Fail}}`	Session timeout warns with option to extend
2.2.2 Pause, Stop, Hide (A)	`{{Pass/Fail}}`	Auto-updating content has pause control

2.3 Seizures and Physical Reactions

Criterion	Status	Notes
2.3.1 Three Flashes (A)	`{{Pass/Fail}}`	No content flashes >3 times/sec

2.4 Navigable

Criterion	Status	Notes
2.4.1 Bypass Blocks (A)	`{{Pass/Fail}}`	Skip-to-content link implemented
2.4.2 Page Titled (A)	`{{Pass/Fail}}`	Unique descriptive page titles
2.4.3 Focus Order (A)	`{{Pass/Fail}}`	Focus order matches reading order
2.4.4 Link Purpose (A)	`{{Pass/Fail}}`	Link text descriptive in context
2.4.6 Headings and Labels (AA)	`{{Pass/Fail}}`	Descriptive heading and label text
2.4.7 Focus Visible (AA)	`{{Pass/Fail}}`	Focus indicator visible on all elements

5. Understandable

3.1 Readable

Criterion	Status	Notes
3.1.1 Language of Page (A)	`{{Pass/Fail}}`	`<html lang="en">` set
3.1.2 Language of Parts (AA)	`{{Pass/Fail}}`	`lang` on foreign language sections

3.2 Predictable

Criterion	Status	Notes
3.2.1 On Focus (A)	`{{Pass/Fail}}`	Focus does not trigger unexpected change
3.2.2 On Input (A)	`{{Pass/Fail}}`	Input change doesn't auto-submit form
3.2.3 Consistent Navigation (AA)	`{{Pass/Fail}}`	Nav consistent across pages
3.2.4 Consistent Identification (AA)	`{{Pass/Fail}}`	Same function = same label

3.3 Input Assistance

Criterion	Status	Notes
3.3.1 Error Identification (A)	`{{Pass/Fail}}`	Errors identified in text, not just color
3.3.2 Labels or Instructions (A)	`{{Pass/Fail}}`	All fields have labels
3.3.3 Error Suggestion (AA)	`{{Pass/Fail}}`	Error messages suggest correction
3.3.4 Error Prevention (AA)	`{{Pass/Fail}}`	Destructive actions require confirmation

6. Robust

Criterion	Status	Notes
4.1.1 Parsing (A)	`{{Pass/Fail}}`	Valid HTML, no duplicate IDs
4.1.2 Name, Role, Value (A)	`{{Pass/Fail}}`	All UI components have accessible name + role
4.1.3 Status Messages (AA)	`{{Pass/Fail}}`	Status messages announced via ARIA live regions

Screen Reader	OS	Browser	Priority	Status
VoiceOver	macOS 14	Safari	HIGH	`{{Pass/Fail/Untested}}`
VoiceOver	iOS 17	Safari	HIGH	`{{Pass/Fail/Untested}}`
NVDA	Windows 11	Chrome	HIGH	`{{Pass/Fail/Untested}}`
NVDA	Windows 11	Firefox	MEDIUM	`{{Pass/Fail/Untested}}`
JAWS	Windows 11	Chrome	HIGH	`{{Pass/Fail/Untested}}`
TalkBack	Android 14	Chrome	MEDIUM	`{{Pass/Fail/Untested}}`

Tested user flows:

User registration / login
Main navigation
Form submission with validation errors
Data table — sorting, pagination, row actions
Modal open/close/action
Toast / notification announced

8. Keyboard Navigation Map

Context	Key	Action
Global	`Tab`	Next focusable element
Global	`Shift+Tab`	Previous focusable element
Global	`Escape`	Close modal, dropdown, toast
Global	`Alt+S`	Skip to main content (custom shortcut)
Dropdown	`Arrow Down/Up`	Navigate options
Dropdown	`Enter/Space`	Select option
Table	`Arrow keys`	Navigate cells (if grid role)
Modal	`Tab`	Cycle within modal (focus trapped)
Date picker	`Arrow keys`	Navigate days
Tabs	`Arrow keys`	Switch tab

9. Color Contrast Verification Table

Element	Text Color	Background	Ratio	AA Pass	AAA Pass
Body text	`#0F172A`	`#FFFFFF`	`{{X:1}}`	`{{Y/N}}`	`{{Y/N}}`
Secondary text	`#334155`	`#FFFFFF`	`{{X:1}}`	`{{Y/N}}`	`{{Y/N}}`
Disabled text	`#94A3B8`	`#FFFFFF`	`{{X:1}}`	`{{Y/N}}`	`{{Y/N}}`
Primary button text	`#FFFFFF`	`#0EA5E9`	`{{X:1}}`	`{{Y/N}}`	`{{Y/N}}`
Link color	`#0284C7`	`#FFFFFF`	`{{X:1}}`	`{{Y/N}}`	`{{Y/N}}`
Error text	`#EF4444`	`#FFFFFF`	`{{X:1}}`	`{{Y/N}}`	`{{Y/N}}`
Placeholder	`#94A3B8`	`#FFFFFF`	`{{X:1}}`	`{{Y/N}}`	`{{Y/N}}`

TODO: Measure all values using {{Colour Contrast Analyser | axe DevTools}}.

10. ARIA Usage Audit

Pattern	ARIA Used	Correct?
Modal dialog	`role="dialog"`, `aria-modal="true"`, `aria-labelledby`	`{{Yes/No}}`
Navigation	`role="navigation"`, `aria-label`	`{{Yes/No}}`
Alert/toast	`role="alert"` or `aria-live="polite"`	`{{Yes/No}}`
Tab panel	`role="tablist"`, `role="tab"`, `role="tabpanel"`	`{{Yes/No}}`
Accordion	`aria-expanded`, `aria-controls`	`{{Yes/No}}`
Custom select	`role="listbox"`, `role="option"`, `aria-selected`	`{{Yes/No}}`
Loading states	`aria-busy="true"`, live region	`{{Yes/No}}`

11. Remediation Priority & Timeline

Issue	WCAG Criterion	Severity	Priority	Assigned To	Target Date	Status
`{{Issue description}}`	`{{1.4.3}}`	`{{Critical/High/Medium/Low}}`	P1	`{{NAME}}`	`{{DATE}}`	`{{Open/In Progress/Fixed}}`

Severity definitions:

Critical: Blocks users with disabilities from core functionality
High: Significant barrier, workaround exists
Medium: Inconvenience, does not block task completion
Low: Minor enhancement opportunity

12. Testing Tools

Tool	Type	Usage	Version
axe-core	Automated	CI integration + Storybook	`{{4.x}}`
`@axe-core/playwright`	Automated	E2E accessibility checks	`{{4.x}}`
Lighthouse	Automated	CI performance + a11y score	Built-in Chrome
pa11y	Automated	Staged URL scanning	`{{6.x}}`
Colour Contrast Analyser	Manual	Color contrast spot checks	TPGi
Screen readers	Manual	See matrix above	—
Accessibility Insights	Manual	Guided manual testing	Microsoft

Approval

Role	Name	Date	Signature
Author
Accessibility Lead
QA Lead
Product Owner

Revision #7
Created 2026-02-23 12:05:16 UTC by John
Updated 2026-05-25 07:33:00 UTC by John

Accessibility Audit

Accessibility Audit

Document History

1. Compliance Target

2. Audit Methodology

2.1 Automated Testing

2.2 Manual Testing

2.3 User Testing

3. Perceivable

1.1 Text Alternatives

1.2 Time-based Media

1.3 Adaptable

1.4 Distinguishable

4. Operable

2.1 Keyboard Accessible

2.2 Enough Time

2.3 Seizures and Physical Reactions

2.4 Navigable

5. Understandable

3.1 Readable

3.2 Predictable

3.3 Input Assistance

6. Robust

7. Screen Reader Testing Matrix

8. Keyboard Navigation Map

9. Color Contrast Verification Table

10. ARIA Usage Audit

11. Remediation Priority & Timeline

12. Testing Tools

Approval