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.
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
Stakeholder Interviews
What are Stakeholder Interviews Stakeholder Interviews are st...
User-Centered Design
What is User-Centered Design User-Centered Design (UCD) is a ...
Mental Model
What is a Mental Model A Mental Model is an individual's inte...
Three-Click Rule
What is the Three-Click Rule? The three-click rule states tha...
Flat Design
What is Flat Design Flat Design is a minimalist design approa...
MVP
What is an MVP MVP (Minimum Viable Product) is a development ...