Breadcrumbs
UX Design
What are Breadcrumbs
Breadcrumbs are secondary navigation elements that show users their current location within a website's hierarchy. Named after Hansel and Gretel's trail of breadcrumbs, they provide users with an easy way to track and navigate back through their location path.
Types of Breadcrumbs
Three main types exist:
- Location-based: Shows hierarchical site structure
- Path-based: Displays user's navigation history
- Attribute-based: Shows metadata categories (common in e-commerce)
When to use Breadcrumbs
Implement breadcrumbs in complex, hierarchical websites with multiple levels of navigation. They're particularly valuable for e-commerce sites, documentation portals, and content-heavy platforms where users need clear context of their location.
How to implement Breadcrumbs
Place breadcrumbs consistently near the top of the page, use clear visual separators (often >/), ensure each level is clickable, and keep labels concise. Make them complementary to primary navigation, not a replacement.
Find your next job!
No, breadcrumbs are a supplementary navigation aid that should complement, not replace, the main navigation menu. They provide additional context and wayfinding support.
Not necessarily. Breadcrumbs are most useful on sites with hierarchical content and multiple levels of navigation. Single-level websites or those with flat architecture may not need them.
Breadcrumbs can improve SEO by helping search engines understand your site structure and providing additional internal linking. They also often appear in search results, making your site's hierarchy clear to users.
UX Design Terms
See more UX Design terms
Binary Metric
What is a Binary Metric A Binary Metric is a measurement that...
A/B Testing
What is A/B Testing? A/B testing in UX design is a method of ...
User-Centered Design
What is User-Centered Design User-Centered Design (UCD) is a ...
Call-To-Action
What is a Call-To-Action A Call-To-Action (CTA) is a design e...
Whiteboard Challenge
What is a Whiteboard Challenge A Whiteboard Challenge is an i...
Accessibility
What is Accessibility Accessibility in UX design refers to cr...