- Breadcrumb link names must correspond to their destination page titles.
- In the example here, the “Web” link uses an
aria-label that corresponds to the full title of the destination page.
- Use a
<nav> with a unique name like
- Placing the links inside
<li> provides context to users about a given breadcrumb’s position in a list and of the total number of breadcrumbs.
aria-current="page" to the last link in the breadcrumb. This represents the current item within a container or set of related elements.
- ARIA Authoring Practices Guide (APG) Breadcrumb Example