Keyboard

Keyboard users navigate a site by tabbing through actionable items on a page, and focus states indicate which item is being focused.

Accordion elements should use an ARIA attribute to communicate an open or closed status to screen readers and other assistive technology.

Many people use only the keyboard to navigate a website. Tabbing order should be logical so that keyboard users can sequentially navigate and use every interactive element on a page.

When keyboard users tabs into modals (like a popup or dialog), focus should remain in that window. This helps prevent users from accidentally moving focus outside the modal without closing it. Users should be able to use the ESC key to close the modal.

Most of the time, content that’s not visible on the screen should also be hidden from keyboard and screen readers. This means that hidden content should not be focusable. For example, an inactive modal shouldn’t be focusable.