Who This Is For

Every accessibility feature in AlloFlow exists because a real student needs it. These are the students we build for.

♿

The student who communicates with a switch

She has cerebral palsy and uses a single head switch to interact with technology. Without scanning mode, a communication board is a picture on a wall. With it, she can build sentences, tell her teacher she needs a break, and ask her mom for water at home — using the same exported board on any device.

🌎

The student whose family speaks Arabic

He's learning English at school but thinks in Arabic. His communication board needs to work right-to-left, with translated labels his parents can read, and arrow keys that move in the direction his family reads. At school he uses the English board. At home, his mom opens the Arabic export and hears his voice in their language.

👁

The student with low vision

She can see shapes and colors but can't read small text. High contrast mode with Atkinson Hyperlegible font, 44px touch targets, and a 3px focus ring mean she can find and select symbols independently. The board doesn't need to be adapted for her — it adapts to her.

44pxMinimum touch target (WCAG 2.5.5)
14Languages with RTL support
100%Keyboard operable (WCAG 2.1.1)
2Switch-access scanning modes

Interactive AAC Board

This is a working communication board. Every feature below is built into AlloFlow's standalone HTML exports — no app or internet required.

⌨ Try it: Click a symbol, or use Tab to focus the grid, then Arrow keys to navigate and Enter to select. Press S to start scanning.

Core Vocabulary Board

Scanning Active Space = select · Esc = stop
Tap symbols to build a message…
Live Screen Reader Announcements
Interact with the board above to see what a screen reader would announce…
Focused Element
Tab into the board to inspect element accessibility properties.

Keyboard Navigation

Every function in AlloFlow is operable without a mouse. The grid uses the WAI-ARIA grid pattern with roving tabindex — only one cell is in the Tab order at a time.

← ↑ → ↓
Navigate between symbols in the grid
Enter / Space
Select the focused symbol (speaks it aloud and adds to message)
Home / End
Jump to start or end of the current row
S
Toggle scanning mode on/off
Tab (in 2-switch scan)
Advance to next cell
H
Toggle high contrast mode
Backspace
Delete last word from message
?
Show keyboard shortcuts help

Switch-Access Scanning

Students who use switch devices can communicate using automatic or manual scanning — built directly into every exported board.

1-Switch (Automatic)

The highlight advances automatically at a configurable speed (1-4 seconds per cell). The student presses their single switch when the desired symbol is highlighted. Best for students with very limited motor control.

2-Switch (Manual)

Switch 1 advances the highlight. Switch 2 selects. No timer — the student controls the pace. Best for students who have enough motor control for two inputs and want faster communication.

Visual Accessibility

AlloFlow respects your operating system's accessibility preferences automatically, and provides manual overrides.

High Contrast Mode

Switches to Atkinson Hyperlegible font, white-on-black, yellow highlights. Toggle with H or the button above.

OS Preferences

prefers-reduced-motion — disables all animations
forced-colors — respects Windows High Contrast
prefers-color-scheme: dark — automatic dark mode

Focus Indicators

Every interactive element has a visible 3px focus ring with a contrasting glow. Uses :focus-visible so mouse users aren't distracted, but keyboard users always see where they are.

Screen Reader Support

The board uses semantic HTML and ARIA to provide a complete non-visual experience. Try the demo board above — the live panel shows every announcement in real time.

ARIA Roles

role="grid" on the board container. role="gridcell" on each symbol with a descriptive aria-label combining the word and its context (e.g., "happy: feeling joyful"). role="log" on the sentence strip. role="tab" / role="tabpanel" for multi-page boards.

Live Regions

Two aria-live regions: the sentence strip (polite) updates its label as words are added. A dedicated status region (assertive) announces state changes — "more added to message", "Scanning started", "High contrast on" — without stealing focus.

Roving Tabindex

Only the currently focused cell has tabindex="0". All others have tabindex="-1". This means Tab enters the grid at one point, and arrow keys navigate within it — matching the WAI-ARIA grid pattern exactly.

WCAG 2.1 AA Conformance

Self-assessed against the AAC board export. We welcome independent validation.

  • 1.1.1 Non-text Content — Every symbol has descriptive alt text (label + context)
  • 1.3.1 Info and Relationships — Semantic landmarks, ARIA grid/tab roles, heading hierarchy
  • 1.4.3 Contrast — All text exceeds 4.5:1 ratio; High Contrast mode for maximum visibility
  • 1.4.11 Non-text Contrast — Borders, focus rings, and scan highlight exceed 3:1
  • 2.1.1 Keyboard — 100% keyboard operable: grid nav, scanning, controls, all shortcuts
  • 2.4.1 Bypass Blocks — Skip-to-content link on every exported page
  • 2.4.7 Focus Visible — 3px focus ring with glow on all interactive elements
  • 2.5.5 Target Size — Minimum 44×44px on all touch targets (AAA level)
  • 3.1.1 Language of Page — Dynamic lang attribute matching board language, RTL support
  • 4.1.2 Name, Role, Value — All ARIA roles, labels, and states correctly implemented
  • 4.1.3 Status Messages — aria-live regions announce all state changes to screen readers

Test It Yourself

The best way to evaluate accessibility is to experience it. Here's how to test this page with the tools accessibility professionals use.

With NVDA (Windows, Free)

  1. Download NVDA from nvaccess.org (free)
  2. Press Insert+Space to enter browse mode
  3. Press Tab to move through the demo board
  4. Listen for "Communication symbols, grid" and cell labels
  5. Press Enter on a cell — listen for the live region announcement
  6. Press S — listen for "Scanning started"

With VoiceOver (macOS, Built-in)

  1. Press Cmd+F5 to enable VoiceOver
  2. Press VO+Right Arrow to navigate
  3. Navigate to the demo board grid
  4. Use arrow keys to move between cells
  5. Press VO+Space to activate
  6. Listen for announcements in the live region

Keyboard Only (No Screen Reader)

  1. Put your mouse in a drawer
  2. Press Tab repeatedly — watch the focus ring
  3. Reach the demo board, press arrow keys to navigate cells
  4. Press Enter to select (hear it speak)
  5. Press S to start scanning — watch the yellow highlight
  6. Press H to toggle high contrast

Automated Tools

axe DevTools (free Chrome extension) — Run a scan on this page. AlloFlow's Document Builder runs axe-core on every export.

WAVE (free browser extension) — Visual overlay showing heading structure, ARIA landmarks, contrast issues.

Lighthouse (built into Chrome DevTools) — Run an Accessibility audit under the Lighthouse tab.

Built for the Students Who Need It Most

AlloFlow is open-source, privacy-first, and FERPA-compliant by architecture. 80+ tools spanning AAC, STEM, SEL, behavioral analysis, and clinical reporting — built by a school psychologist for the students who fall through the cracks of one-size-fits-all edtech.

We welcome independent accessibility audits, usability testing with assistive technology users, and partnership with organizations working to make education accessible for everyone.

For School Districts

The ADA Title II WCAG 2.1 AA compliance deadline is April 24, 2026. AlloFlow is built accessible from the ground up — not retrofitted. Every export, every tool, every interaction.

For Accessibility Professionals

We don't want a rubber stamp. We want the work to actually be right. If you evaluate accessibility tools, we'd welcome your scrutiny and feedback.

Support AlloFlow View Source on GitHub