Breadcrumbs

A navigation element showing the user's location within a website's hierarchy (e.g., Home > Blog > SEO > Keyword Research), which also appears in Google search results when properly marked up with structured data.

Updated June 9, 2026

TL;DR

Breadcrumbs are the 'Home > Category > Page' trail that shows where you are on a site. They improve UX, help Google understand your site structure, and can appear in SERP results to replace the URL — making your listing more descriptive.

Key Points

Google can display breadcrumb trails in search results instead of the page URL, making results more readable and clickable

Breadcrumbs require BreadcrumbList structured data ([[schema-markup|schema markup]]) to appear in Google SERP rich results

Breadcrumb links are a form of [[internal-linking|internal linking]] — they add navigational links from every page back up through the hierarchy

Google uses breadcrumb structure as a signal for understanding site architecture and categorizing pages

Types of Breadcrumbs

There are three main types of breadcrumb navigation[1]. Location-based breadcrumbs (most common) show the page's position in the site hierarchy: Home > Products > Electronics > Smartphones. Path-based breadcrumbs show the user's browsing history — rarely used in SEO because they vary by session. Attribute-based breadcrumbs show the facets of the current page, common on e-commerce filter pages: Home > Shoes > Running > Men's > Size 10. For SEO purposes, location-based breadcrumbs are the standard. They should reflect your URL structure — if your URL is `/blog/seo/keyword-research/`, the breadcrumb should be Home > Blog > SEO > Keyword Research. Mismatches between breadcrumbs and URL structure create confusion for users and crawlers.

Implementing Breadcrumb Structured Data

For breadcrumbs to appear in Google search results, you must implement BreadcrumbList schema markup[1][2]. The JSON-LD format (preferred by Google) looks like: a `BreadcrumbList` item containing an `itemListElement` array where each item is a `ListItem` with `position`, `name`, and `item` (the URL) properties. In Next.js, this is typically added as a `