Breadcrumbs

Breadcrumbs are a secondary navigation element that represents a row of links separated by dividers, often chevron icons (>). Like in the tale of Hansel and Gretel, breadcrumbs leave a trail to guide users. They show users' current location and help them find their way around the product.

The last element on the trail should be different from the rest of the path since it represents users' current position. However, it should never be a link. Learn more about breadcrumbs in our Intro to Breadcrumbs lesson and get familiar with the design tips from the Breadcrumbs Best Practices lesson.

Breadcrumbs typically appear at the top of a page and provide a hierarchical trail of links that allows users to easily move up and down the website structure.

Breadcrumbs serve several purposes:

Navigation: They provide a clear way for users to navigate back to higher-level pages without having to use the back button or return to the homepage.

Context: They give users a visual representation of where they are within a website's structure, providing context and orientation.

Usability: They make it easier for users to find their way around a website, especially when there are many levels of nested pages.

Accessibility: They provide a secondary means of navigation for users who may have difficulty using the main navigation.

Breadcrumbs also play a critical role in search engine optimization (SEO) as they provide structure and organization to a website's content. By including breadcrumbs in a website's design, users can easily see the hierarchy of pages and understand the relationships between different sections.

Additionally, breadcrumbs can help search engines better understand a website's structure and hierarchy. This, in turn, can improve a website's visibility and ranking in search results.

Breadcrumbs also make it easier for users to find specific pages within a website and to navigate back up the hierarchy to higher-level pages. Allowing users to easily find the information they are looking for can greatly improve user engagement and reduce bounce rates.

Whether or not to use breadcrumbs on your website depends on the type and structure of your website, as well as your target audience and their needs.

Breadcrumbs are most useful for websites with a large and complex structure. They provide an easy way for users to understand the hierarchy of pages and move between different sections. They are also useful for websites with a lot of nested pages, as they allow users to easily navigate back up the hierarchy to higher-level pages.

On the other hand, if your website has a simple structure with only a few pages, breadcrumbs may not be necessary. In this case, a clear and well-designed navigation menu may be sufficient to help users find what they're looking for.

If you're unsure, consider conducting user testing to see how users navigate your website and what kind of navigation elements would be most helpful for them.