# What Are Breadcrumbs on a Website?

> What website breadcrumbs are, how to mark them up with BreadcrumbList, what changed in Google in 2025 and how to check that the path and the markup match.

URL: https://clione.ai/glossary/breadcrumbs/
Lang: en

You see them above the title of almost any [product page](/glossary/product-page/): Home › Women › Shirts › Linen shirt. The name comes from the story of Hansel and Gretel, who dropped crumbs to find their way back. In a store they do two jobs at once. They orient someone who lands on a product page from a search engine without passing through the home page, and they tell Google where in the catalog that page sits. **They are navigation and [structured data](/glossary/structured-data/) at the same time**, and what matters is that they say the same thing in both places.

## How they work

**What the visitor sees.** The W3C, in its accessibility patterns guide, defines breadcrumbs as a list of links to the parent pages of the current page, in hierarchical order. It asks for three things: that the list sit inside a navigation landmark, that the landmark have a label (with `aria-label` or `aria-labelledby`) and that the link to the current page carry `aria-current="page"`, so a screen reader announces where you are.[^wai-breadcrumb] Google describes the same idea from the other side: breadcrumbs indicate the page's position in the site hierarchy, can help it understand and explore the site, and let you go up one level at a time starting from the last crumb.[^google-breadcrumb]

**Which hierarchy they show.** This is the decision that goes wrong most. Google recommends that breadcrumbs **represent a typical user path to the page, rather than copy the URL structure**. There is no need to include the domain level or the page itself, and a page reached by different paths can declare more than one: in Google's example, the same literary awards page hangs from "Books › Science Fiction Novels" and also from "Literature".[^google-breadcrumb]

**What the search engine reads.** Breadcrumbs are marked up with the BreadcrumbList type from [Schema.org](/glossary/schema-org/), which the vocabulary defines as an [ItemList](/glossary/itemlist/) made up of a chain of linked pages, normally described by their URL and name, and which usually ends at the current page. The `position` property is what rebuilds the order, starting at 1.[^schema-org-breadcrumblist] Google asks for **a BreadcrumbList with at least two items** of type ListItem, each with three properties: `item` (the URL of that crumb's page), `name` (the text the visitor sees) and `position` (its place in the path, where 1 is the start). The last crumb can go without `item`: Google then uses the URL of the page that contains it.[^google-breadcrumb]

**What changed in Google.** On January 23, 2025, Google stopped showing breadcrumbs in mobile search results, in all languages and regions, because on small screens they got cut off and were not as useful. On mobile, the result's visible URL is reduced to the domain; on desktop it still shows the domain and the breadcrumb path. Google clarified that anyone using the markup does not need to do anything, because it still supports it for desktop results, and that the breadcrumb [rich results](/glossary/rich-results/) report in [Search Console](/glossary/google-search-console/) and the [Rich Results Test](/glossary/rich-results-test/) remain available.[^google-breadcrumb-mobile] Its documentation says it that way today: the feature is available on desktop in all regions and languages where Search is available.[^google-breadcrumb]

**And every crumb is a link.** Google uses links as a signal to decide how relevant pages are and to find new pages to crawl, and in general it can only follow a link if it is an `<a>` element with an `href` attribute.[^google-links] Breadcrumbs built with buttons that navigate through JavaScript look the same, but a [crawler](/glossary/web-crawler/) may not follow them.

## In a store

The visible path and its markup, one below the other. **Fictitious example**: the store, the categories and the addresses are made up.

```html
<nav aria-label="Breadcrumbs">
  <ol>
    <li><a href="https://www.example.com/">Home</a></li>
    <li><a href="https://www.example.com/women">Women</a></li>
    <li><a href="https://www.example.com/women/shirts">Shirts</a></li>
    <li>
      <a href="https://www.example.com/calella-linen-shirt" aria-current="page"
        >Calella linen shirt</a
      >
    </li>
  </ol>
</nav>

<script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
      {
        "@type": "ListItem",
        "position": 1,
        "name": "Home",
        "item": "https://www.example.com/"
      },
      {
        "@type": "ListItem",
        "position": 2,
        "name": "Women",
        "item": "https://www.example.com/women"
      },
      {
        "@type": "ListItem",
        "position": 3,
        "name": "Shirts",
        "item": "https://www.example.com/women/shirts"
      },
      { "@type": "ListItem", "position": 4, "name": "Calella linen shirt" }
    ]
  }
</script>
```

You check them position by position: each `name` is the text of a visible crumb, each `item` is the address of its link, and the order is the same. The last crumb goes without `item`, because it is the page you are on. Notice that the product page's URL, `/calella-linen-shirt`, does not contain `/women/shirts`, and that is fine: **breadcrumbs describe the visitor's path, not the address**.[^google-breadcrumb] If the same shirt is also in the sale section, the product page can declare a second path instead of picking one at random.[^google-breadcrumb]

On a product page published with Clione, the BreadcrumbList sits inside the same [`@graph`](/glossary/graph/) as the [Organization](/glossary/organization-schema/), [WebSite](/glossary/website-schema/) and [Product](/glossary/product-schema/) nodes.


Removing the breadcrumb markup because Google no longer shows breadcrumbs on mobile. The January 2025 change was one of presentation: Google says that anyone using the markup does not need to do anything, that it still supports it for desktop results and that the Search Console report remains active.[^google-breadcrumb-mobile]


## How to check it

1. **Read the visible path on a product page** and open its source code: every crumb except the last must be an `<a>` link with an `href`.[^google-links]
2. **Run the URL through the Rich Results Test.** It tells you which rich result types it finds, breadcrumbs among them, and with what errors or suggestions.[^rich-results-test]
3. **Compare crumb by crumb** the `name`, the `item` and the `position` of each element with what the visitor sees, and confirm there are at least two.[^google-breadcrumb]
4. **Watch the Search Console breadcrumb report after changing theme or template.** Google warns that an increase in invalid items after a change usually points to a template that is not working.[^google-breadcrumb]
5. **Search for your product page on Google from a computer**, not a phone: it is where Google still shows the breadcrumb path under the title.[^google-breadcrumb-mobile]

## Related concept: internal linking

Breadcrumbs are a form of [internal linking](/glossary/internal-linking/), but they are not all of it. Internal linking is the set of links between pages on your own site: the menu, related products, links inside a description and also breadcrumbs. Google reads each link's text as a clue about the destination page, for people and for itself.[^google-links] In breadcrumbs that text is the name of each [category page](/glossary/category-page/), so **a good category name works twice**: it orients the visitor and describes the page it points to. What sets breadcrumbs apart from the rest of the linking is their order: they do not show the whole site, as a menu does, but the path to the page you are on.

To keep going, the [structured data reading path](/learn/structured-data/) orders the rest of the terms, and the guide to [auditing a product page's structured data](/guides/audit-product-page-structured-data/) includes breadcrumbs in the review of a full product page.
