Skip to main content Red Hat Design System logo Contribute on Github

Breadcrumb

Overview Style Guidelines Code Demos Accessibility

Keyboard navigation

Users should have the ability to move focus to a breadcrumb and activate a breadcrumb link using their keyboard.

Key Result
Tab Moves focus to the next linked breadcrumb or interactive element
Shift + Tab Moves focus to the previous linked breadcrumb or interactive element
Enter Activates a link

Focus order

A logical focus order helps keyboard users operate our websites. Elements need to receive focus in an order that preserves meaning, therefore the focus order should make sense and not jump around randomly. In breadcrumb navigation, the focus order moves from left to right. In languages that are read right to left, the focus order also moves right to left.

breadcrumb navigation with numbers denoting focus order proceeds from left to right
© 2021-2024 Red Hat, Inc. Deploys by Netlify