A11y Hell

Blog

Focus Traps: The Fastest Way to Lose Keyboard Users

Focus traps are one of the most damaging failures because they completely block progress. In production, they often appear in modals, drawers, or custom widgets without close controls.

How to test

  1. Open the modal using only the keyboard.
  2. Attempt to tab outside the modal or close it with Escape.
  3. Confirm that focus returns to the trigger after closing.

Fix strategy

  • Add a keyboard-accessible close button.
  • Implement Escape handling and focus restoration.
  • Use a focus trap library only when necessary.
Screen reader simulation closed. Audio disabled.

Screen Reader

Simulation Mode

Active — Tab to navigate

Currently Announcing

Focus on an element to see announcement

Announcement History

No announcements yet

Press Tab to start navigating

This simulates what screen reader users hear.
No visuals — just these announcements.
Shortcut: Shift + Alt + S