2.4.7Focus Visible

A UI where pressing a heading toggles a panel open or closed. Uses a button with aria-expanded to convey the current state to assistive technologies.

The simplest show/hide pattern, like a "show more" toggle that reveals or hides a single section.

A dialog that renders in the foreground while making the background inert. Requires a focus trap and Escape key to close.

An application-style menu built with role="menu" and related roles, navigated using arrow keys.

The fundamental yet nuanced link. Explains why you should use the a element instead of a div with onclick.

The most fundamental control. Covers the built-in accessibility the button element provides and the pitfalls of custom implementations.

Switches content within the same area. Uses arrow key navigation, aria-selected, and roving tabindex.