Avoid a keyboard trap

A keyboard trap is when keyboard users get stuck in a part of a page and cant navigate out using the keyboard alone. Make sure keyboard users are always able to navigate away from components on a web page.

According to Understanding SC 2.1.2: No Keyboard Trap: If the keyboard focus can be moved to a component of the page using a keyboard interface, then the focus can be moved away from that component using only the keyboard.

When you develop a custom component and the keyboard focus cannot be moved using standard keys such as escape, arrows, or tabs, then inform the user about how they can operate and leave the component by keyboard. For example in a content editor where the user may need to use arrows and tabs to navigate the content.

A keyboard trap and a focus trap are two different patterns:

  • Keyboard trap is a WCAG violation, the keyboard user is stuck and cannot escape.
  • Focus trap is a feature, the keyboard focus is intentionally contained, but the user can always move away.

More about the focus trap on: Sustain keyboard focus within a responsive menu or dialog component.

How to test

How to test with a keyboard is described with Keyboard navigation testing in this documentation.

  • Navigate the page using the keyboard.
  • Especially test forms, filters, modals, menus and tabular interfaces.
  • If you cant navigate further or back out of the component, check for instructions on how to do so.

Resources

WCAG Success Criteria for keyboard focus

Keyboard navigation support in the Theme guidelines for the WordPress accessibility-ready program.

  • First published: October 10, 2025
  • Last updated: August 04, 2026
  • Edit article: Improve it on GitHub

Other pages in: Handling focus

  • Tabindex and tab order

    Make the tab order of the keyboard focus predictable and sequential.

  • Visual focus

    Make sure keyboard focus is clearly visible while navigating through a web page.

  • Trapping focus

    Constrain focus within a responsive menu or dialog component.

  • Restore focus

    Restore the keyboard focus after completing a task or action.

  • Autofocus

    Automatically setting a focus location when a page loads can be confusing and unwanted.

  • On input, focus and hover

    Do not surprise users with unexpected behavior on input, focus or hover.

Back to: Handling focus

Quick links and main topics

Quick links

Content

Disclaimer: This documentation is intended to help the WordPress community understand and implement accessible practices. It is not a replacement for the official Web Content Accessibility Guidelines. Please read the full disclaimer.

Back to top