Breadcrumbs

The name comes from Hansel and Gretel, who left a trail of breadcrumbs to find their way home. On a website, breadcrumbs are that trail: a short line of links from the homepage down to the current page.

Home > Shop > Single Origin > Colombia Huila

Each step except the last is a link, so a visitor can jump back up a level in one click.

Why they matter

For visitors, breadcrumbs answer “where am I?” at a glance. Someone who lands on Bean & Barrel Coffee’s Colombia Huila product page from Google can tap “Single Origin” to browse similar coffees instead of hitting the back button.

For search engines, breadcrumbs add internal links from every page to its parent categories, which reinforces the site’s structure and helps category pages collect authority. They also make deep pages easier to crawl.

In search results, Google has used breadcrumbs in place of the raw URL. In early 2025 Google stopped showing breadcrumbs in mobile results, which now show just the site name and domain, but desktop results can still show the breadcrumb trail. The structured data is still supported.

Types

• Hierarchy-based: follows the site structure (most common and most useful).
• Attribute-based: reflects filters chosen on ecommerce sites, like “Coffee > Dark roast > Whole bean”. Use carefully alongside faceted navigation.
• History-based: shows the visitor’s own path. Rarely useful, since the back button does the same job.

Adding breadcrumb schema

Visible breadcrumbs should be backed by BreadcrumbList structured data, usually in JSON-LD:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    { "@type": "ListItem", "position": 1, "name": "Shop", "item": "https://www.example.com/shop/" },
    { "@type": "ListItem", "position": 2, "name": "Single Origin", "item": "https://www.example.com/shop/single-origin/" },
    { "@type": "ListItem", "position": 3, "name": "Colombia Huila" }
  ]
}
</script>

Yoast, Rank Math and most WooCommerce themes can output both the visible trail and the schema.

Common mistakes

• Breadcrumbs that don’t match the real structure, for example linking to a category page that doesn’t exist.
• Using the full page title as every crumb, producing a trail too long to read on mobile.
• Schema that differs from the visible trail.
• Putting a product in several categories without choosing a primary one, so breadcrumbs change from page to page.

How to check

Run a product or service page through Google’s Rich Results Test to confirm the breadcrumb markup is valid. The free Schema Generator can build BreadcrumbList code if your theme doesn’t provide it.