In breadcrumbs, the final link of the breadcrumb trail may be a link to the current page. When that’s the case, the link also needs to include information that it is the current page.
Why this matters
Screen readers will inform their users that the link is the current page, which will most likely prevent them from clicking it and reloading the current page when they thought they’d be taken somewhere else.
How to implement
Ensure that the
<a> wrapping the current page includes the
aria-current attribute set to the value of
Ensure that none of the other links in the breadcrumb include the
<nav aria-label="Breadcrumbs"> <ol> <li><!-- Home Link --> ...</li> <li>...</li> <li>...</li> <li><a aria-current="page" href="https://accessibility.perpendicularangel.com/roles/ux-designer/identifying-image-types/">Identifying Image Types</li> </ol> </nav>
How to test
Right-click and inspect the page, confirming that:
<a>wrapping the current page includes the
aria-currentattribute set to the value of
- None of the other links in the breadcrumb include the