Breadcrumb
Synonyms: breadcrumb trail, breadcrumb navigation, location trail, secondary navigation, wayfinding trail
Definition
Use cases
- Deep landings from search: Someone arrives on a product page directly from Google with no sense of context. A breadcrumb tells them they're in Electronics > Laptops and lets them browse up to the category.
- Lost in a big content site: On large docs or e-commerce sites, users dig several levels deep and can't easily climb back out. Breadcrumbs give them the ladder.
- SEO and search appearance: With breadcrumb structured data, Google can show the trail in results, which helps users understand the page before they click.
How it's used in practice
- Use location-based, not path-based: Reflect the site's IA hierarchy, not the click history. History trails get long, repetitive, and break for deep-link arrivals.
- Place them right: Put the trail near the top, just below the global nav and above the page title, kept small and secondary.
- Link every level but the last: Make each ancestor a working link; the current page is plain text, not a link.
- Add structured data: Mark up the trail with schema.org BreadcrumbList code (usually a small snippet, often auto-added by your CMS or SEO plugin). Users never see it, but it lets Google show the breadcrumb trail in search results instead of the raw URL. Just keep the markup matched to the visible trail.
Challenges & limitations
- Mobile space: Long trails wrap or truncate on small screens, so they need careful collapsing or shortening.
- Messy information architecture: Breadcrumbs only work when the hierarchy is clear. If content lives in multiple categories or the structure keeps changing, the trail becomes inconsistent and users stop trusting it.
Free resources
- NN/g: Breadcrumbs — 11 Design Guidelines — the definitive guide for desktop and mobile breadcrumbs.
- NN/g: Breadcrumb Navigation Increasingly Useful — why breadcrumbs help and rarely hurt.
- NN/g: Navigation — You Are Here — how breadcrumbs fit into broader wayfinding.

