Screen Reader Test Checklist
Verify every Meridian view against this recipe before shipping.
1. Heading Hierarchy
- • Single
<h1>per page - • No skipped levels (h1 → h3 without h2)
- • Headings describe the section that follows
2. Landmarks
- •
<header>with banner role - •
<main>wraps primary content - •
<nav>on every navigation block - •
<footer>with contentinfo role
3. Focus Management
- • Tab order matches visual order
- • Focus ring visible on every interactive element
- • No focus traps (Esc closes modals)
- • Skip-to-content link as first tab stop
4. Interactive Elements
- • Buttons use
<button>, not div - • Links navigate; buttons act
- • Every input has a visible label
- • Error messages linked via aria-describedby
5. Dynamic Content
- • Live regions announce state changes
- • Loading spinners have aria-busy
- • Toast notifications use role="alert"
- • Route changes move focus to new h1
6. Color & Contrast
- • Text meets 4.5:1 ratio against background
- • Information is never conveyed by color alone
- • Links are underlined or have 3:1 non-color distinction
Run this checklist with NVDA + Firefox or VoiceOver + Safari. File bugs under the a11y label.