Breadcrumbs
also known asbreadcrumb navigation · breadcrumb trail · path navigation
A horizontal trail of links showing the user's location in a hierarchical structure, separated by slashes or chevrons.
Breadcrumbs are a row of links representing the path from the site root down to the current page, separated by `/` or `›`. The current page is the last segment, usually shown unlinked and bold; preceding segments are clickable and styled as muted text.
The pattern serves three purposes: orientation (where am I?), navigation (jump back up the tree), and SEO (gives crawlers an explicit hierarchy via `BreadcrumbList` schema). Modern implementations almost always include the JSON-LD structured data so Google can render breadcrumbs in search results.
Breadcrumbs work only for genuinely hierarchical sites — docs, e-commerce categories, file systems, multi-level admin panels. They're useless on flat sites and confusing on apps where navigation isn't tree-shaped.
- Documentation sites with nested categories
- E-commerce category pages
- Admin panels with multi-level hierarchy
- File browsers and asset libraries
- Flat sites with 2 levels or fewer — adds clutter without benefit
- Single-page apps where there's no real hierarchy
- +Include `BreadcrumbList` JSON-LD schema for SEO
- +Make all parent segments clickable, current page text-only
- +Use `›` or `/` consistently across the site
- −Don't include the current page as a link — it's where you are
- −Don't show breadcrumbs on the homepage
- −Don't truncate aggressively on mobile — collapse to first/current with ellipsis
People also ask
Are breadcrumbs good for SEO?
Yes — Google uses `BreadcrumbList` structured data to display breadcrumb paths in search results, which improves click-through rate. Always pair the visible breadcrumbs with the JSON-LD schema.