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
Flat Design
What is Flat Design Flat Design is a minimalist design approa...
Flowchart
What is a Flowchart A Flowchart is a visual representation of...
Parametric Searching
What is Parametric Searching Parametric Searching is a refine...
Responsive Web Design
What is Responsive Web Design Responsive Web Design (RWD) is ...
Card Sorting
What is Card Sorting? Card sorting is a user research techniq...
User Engagement
What is User Engagement? User engagement measures meaningful ...
