Many users with physical or motor disabilities rely on a keyboard to navigate the web. Other assistive technologies such as screen readers also rely on keyboard accessibility. It's important that components and interfaces can be experienced with a keyboard.

Visible focus states for interactive elements

Interactive components need to have a visible focus style so that users relying on keyboard navigation can easily see where they are on the page.

Focus States


Ordering content with meaningful sequence

Users reading a page with assistive technologies need to do so in a predictable way. Failing to make content navigable in the correct sequence will confuse users and potentially make it impossible to complete a task.

To check content order:

  • Follow the hierarchy of Odyssey typography.
  • Annotate the proper content hierarchy.
  • Include keyboard testing as part of QA.
  • Include keyboard interactions as part of the design spec.
Content Ordering