Breadcrumb

A trail of links showing the user's location in a hierarchy.

Pattern

A breadcrumb is a horizontal list of links representing the user's path from the site root to the current page. The current page is named but not a link; previous pages are links.

Roles

navigation

States and properties

aria-current: Set to "page" on the link or text representing the current page.
aria-label: On the nav landmark, e.g. "Breadcrumb".

Keyboard interaction

Tab: Move between breadcrumb links.

WCAG criteria

2.4.8 — Location (AAA)

Canonical reference

WAI-ARIA Authoring Practices Guide — Breadcrumb

All patterns
WidgetPatternAnalyzer — the analyser that validates these patterns.
Back to Paradise