Screen Reader Guide

SCREEN READER FOUNDATIONS

0 of 20
Course progress: 0 / 20 lessons

PRACTICE 2 OF 9 · Controls and navigation

Keyboard trap

Open a panel and test whether keyboard users can move through and leave it predictably.

  • Level: Intermediate
  • Time: 5-10 minutes
Objective

Identify when an interface traps keyboard focus or fails to provide an expected escape path.

PREPARE

Set up your test

  1. Turn on a screen reader you know how to operate.
  2. Navigate by controls or use Tab where the task asks you to.
  3. Listen for purpose and state, not one exact sequence of spoken words.

WORKING EXAMPLE

Establish the expected behavior

Open the panel. Use Tab, Shift+Tab, Escape, and the close button to confirm you can leave it.

Expected behavior: opening the panel does not leave keyboard users stuck; there is an obvious keyboard-operable way out.

INTENTIONAL DEFECT

Find the barrier

The example below deliberately contains one accessibility defect. Skip the defective example.

Open the panel and try to leave using only the keyboard.

Hint

The demo intentionally provides no close control and no Escape behavior after the panel opens.

End of intentional defect.

DIAGNOSE

Choose the primary cause

What is the primary barrier in the defective panel?

EXPLANATION

Understand and repair it

Reveal explanation

What happened

The defective panel opens extra controls but provides no keyboard-operable way to dismiss it. Real overlays can make this worse by preventing access to the rest of the page.

Repair

Provide a visible close control, support Escape when appropriate, manage focus deliberately, and return focus to the opener after closing.

<button type="button" id="open-settings">Open settings panel</button>
<section id="settings-panel" hidden>
  <h2>Settings</h2>
  <button type="button" id="close-settings">Close panel</button>
</section>

Retest

  • Open the panel and confirm focus moves to a useful location or remains predictable.
  • Confirm the close control and Escape key both work if Escape is part of the pattern.
  • Confirm focus returns to the opener after the panel closes.

Report it

Example: The settings panel opens from the keyboard but cannot be dismissed from the keyboard, creating a keyboard trap.

Standards and support

This exercise describes behavior rather than promising identical speech across screen reader and browser combinations.

Editorially reviewed 20 July 2026.