🔈
Text-to-Speech Narration
All student module lessons are narrated using the browser's Web Speech API. Students can have any lesson read aloud, paused, stopped, or set to auto-play. Mute preference is saved locally.
Live
📺
Per-Card Audio
Students can tap or click individual concept cards and analogy boxes to hear them read aloud. A visible speaking indicator shows which card is currently being read.
Live
▶
Skip to Main Content
Every page includes a visible skip link that appears on keyboard focus, allowing keyboard and screen reader users to bypass navigation and jump directly to content.
Live — Phase 15
▲
Focus Visibility
All interactive elements (links, buttons, quiz options, navigation items) show a visible focus ring when navigated by keyboard, using a high-contrast orange outline.
Live — Phase 15
⎕
Keyboard Quiz Navigation
Quiz answer options support keyboard interaction. Students can Tab to focus each option and press Enter or Space to select it — no mouse required for quiz participation.
Live — Phase 15
🌟
Reduced Motion Support
Students with vestibular disorders or motion sensitivity can enable "Reduce Motion" in their device accessibility settings. Badgie Academy respects this preference and disables animations.
Live — Phase 15
🌟
ARIA Labels & Roles
Navigation, panels, quiz groups, and feedback regions include ARIA labels and roles. Quiz feedback regions use aria-live so screen readers announce results automatically.
Live — Phase 15
🔍
Semantic HTML Structure
Pages use semantic HTML elements including nav, main, section, article, aside, h1-h3 heading hierarchy, and proper list structures to support assistive technology navigation.
Live
🏛
Responsive Mobile Design
All pages are mobile-first responsive. Touch targets meet minimum size requirements. Content reflows for small screens without horizontal scrolling. The voice control bar adapts for mobile.
Live
🆂
Language Declaration
All pages declare lang="en" on the html element, allowing screen readers and translation tools to identify the correct language for content processing.
Live
🖼
Image Alt Text
The Badgie logo image in student modules includes descriptive alt text. Decorative emoji elements use aria-hidden to prevent screen readers from announcing them unnecessarily.
Live
🌟
Full Keyboard Screen Audit
A comprehensive keyboard-only navigation audit across all student modules, including all quiz interactions, TTS controls, and Badgie Tutor functionality.
Planned — Future Phase