Breadcrumbs — Accessibility Specification

WCAG 2.1 AA • AODA compliant • Updated 2025-10-28

What is this component?

What is this component? Breadcrumbs show the user’s location in a site hierarchy and provide quick navigation to ancestors.

Accessibility Requirements

RequirementWCAG CriteriaDescription
Landmark/Structure1.3.1, 2.4.1Use <nav aria-label="Breadcrumb"> and an ordered list of links.
Current page4.1.2Mark the last item as current with aria-current="page" and render as text (not a link).

ARIA Roles and Attributes

ARIA Role/AttributeUsed OnPurpose & Usage
<nav aria-label="Breadcrumb">ContainerAnnounces purpose to AT.
aria-current="page"Current page itemConveys that the item represents the current page.

Implementation Guidelines

DO’s

Don’ts

Common Pitfalls

Testing Checklist

Test ItemWCAG CriteriaPass Criteria
Nav and order2.4.1, 1.3.1Announced as breadcrumb; items ordered parent→child.
Current page4.1.2Final item is text with aria-current.