HTML Recipes

Breadcrumbs

While it may be tempting to use a list of some type, technically breadcrumbs aren't truly a list, but a hierarchy (of which there may be multiple hierarchies, that is multiple ways to reach a page).

Thus the simple approach of a series of links, grouped within a p is appropriate. If there are multiple breadcrumb trails to show, then each would be wrapped within its own p. As it is page navigation, the entire set of links should be wrapped in a nav.

It is expected that a visual delimiter is placed between each link via CSS.

<nav>
  <p>
    <a href="/">Home</a>
    <a href="/menu">Menu</a>
    <a href="/pizza">Pizza</a>
  </p>
</nav>