What Are Breadcrumbs & How to Use Them on Your Website

Clear navigation is just one of the important things to consider to provide a positive experience on your website.

Can users easily find what they are looking for? Are key pages contained within the main menu? 

Breadcrumb navigation can help user experience and SEO.

In this blog, we explain what breadcrumbs on a website are, the potential benefits they can offer users and SEO, and the different types of breadcrumb navigation. 

We’ll also share SEO best practices for breadcrumbs and explain how to add them to your website.

What Is Breadcrumb Navigation?

Breadcrumbs are automated internal links that help users visually see where they are in the website’s architecture. This includes distance from the homepage.

A useful navigational feature, breadcrumbs usually sit at the top of a webpage. These are in addition to having the navigational menu. 

Users can click on breadcrumb links to hop between pages.

What Are the Benefits of Breadcrumbs?

Breadcrumbs can be beneficial in many ways, both for search engines and users.

Breadcrumbs Improve User Experience

We’ve all experienced a website that made it hard to find what we needed, and that can be frustrating. Websites that are hard to use are much more likely to have a higher bounce rate. 

Breadcrumbs can help users find what they are looking for quickly and easily. This leads to an improved user experience (UX), with users more likely to convert.  
Learn more with our guide on how user experience can benefit SEO.

Encourage Users To Stay on Site

Breadcrumb links can also help users discover other pages that may be useful. Users may stay on site longer as a result. 

If a user ‘bounces’ back to search results, that sends a signal to search engines that the page may not have met the keyword intent. This can harm keyword rankings.

Engagement rate is also now a key reporting metric in Google Analytics.

Improved Internal Linking

Breadcrumbs create further internal links between pages. Internal links are good for SEO and help users navigate a website. 

It also means that search engines are more likely to find, crawl, and index your pages. A good internal linking structure can help to prevent orphan pages.

Does Every Website Need Breadcrumbs?

No, not every website needs breadcrumbs, but they can be beneficial in helping users and search engines to find pages.

Breadcrumbs are particularly beneficial on sites with a large number of pages, such as e-commerce sites, blogs, healthcare, and education websites (to name a few).

Different Types of Breadcrumb Navigation (With Examples)

What are the different types of breadcrumb trails that you can have on your website?

Location-Based or Hierarchy Breadcrumbs

The most common type of breadcrumb navigation is location-based (or hierarchy) breadcrumbs. This tells you where in the website hierarchy you are located, including distance from the homepage.

Location breadcrumbs can be helpful for users sifting through hundreds or even thousands of products. 

For example: Groceries > Dairy, eggs & chilled > Pizza, pasta & garlic bread > Pizza

Attribute Breadcrumbs

Attribute-based breadcrumbs, as the name suggests, show different attributes that a user has clicked to narrow their search.

They are most commonly used on e-commerce websites and used in conjunction with location-based breadcrumbs.

For example: Home > Electronics > Computers & Tablets > Laptops & Netbooks > Apple Laptops & Netbooks

Forward or Look-Ahead Breadcrumbs

Forward (or look-ahead) breadcrumbs help to show users the next steps they can take on the website. This can help to guide the user journey. 

For example: Industries > Agriculture > Farming > Explore Industry

History Breadcrumbs

History breadcrumbs work similarly to browser history, where the breadcrumb trail will show you previously visited pages.

This type of breadcrumb trail is much less common, as it may confuse users, and it’s also not as useful in guiding them to further information. 

For example: Home > Products > Sale > Sale Dresses > Sale

Best Practices for Breadcrumbs

Consider SEO best practices before you add breadcrumbs to your website.

Keep Breadcrumb Design Clean and Simple

The design of the breadcrumbs needs to be kept clean and simple. They shouldn’t clutter the page or draw attention away from important information. 

Although the current page may be named in the breadcrumb trail, it doesn’t need a link to it. This can be confusing and serves no purpose. 

Use separators between paths so that they are easy to read. You can use arrows or forward slashes.

Position at the Top

The whole point of breadcrumbs is to aid navigation, so they should be in a prominent position at the top of the page. 

Under the main menu, H1, or main image is a good placement. 

Text size shouldn’t be large. Again, keep it clean and simple and use it as a tool for navigation rather than a visual distraction.

Choose the Right Type of Breadcrumb Trail

Decide which type of breadcrumb trail will be most useful to users. In many cases, location-based breadcrumbs will be preferred, but consider all options.

Make Sure They Add Something

Only add breadcrumbs to your site if you feel it’s going to enhance the user experience. 

If they are not going to be helpful, you are bloating your site with unnecessary code. This can mean a cluttered design and slower site speed.

Use Breadcrumbs With Strong Navigation

Breadcrumbs are not a substitute for poor navigation. They are an alternative way for users to navigate your site. 

Make sure your main navigational menu is:

• Logical and hierarchical
• Labelled descriptively
• Linking to key pages
• Working on mobile devices
• Easy to use

Breadcrumbs shouldn’t just replicate the main menu. They should serve a different purpose, and if they don’t, breadcrumbs might not be needed on your site.

Regularly Audit for Issues

As with any SEO aspect, regular audits should be carried out to find any issues that need fixing. 

If you implemented breadcrumbs but the links aren’t working, they could be doing more harm than good. 
Use auditing tools to regularly check for broken links. Our guide to broken links explains the impact they can have on your SEO performance.

How To Add Breadcrumbs to a Website

Now that we’ve established different types of breadcrumbs on a website, plus their benefits and best practices, how can they be implemented?

The easiest way to add breadcrumbs to your site is via a plugin.

Yoast SEO has a built-in feature for adding breadcrumbs. You can activate this within the Settings section. 

Content Management Systems (CMS) such as WordPress and Shopify also have built-in features for breadcrumbs. Each CMS will have a guide on how to configure breadcrumbs depending on your theme and setup.

Final Thoughts

Breadcrumbs offer an alternative solution for navigating websites. They can improve internal linking and help users and search engines discover pages. They can improve user experience and encourage users to stay on site for longer.

Not every website will need breadcrumbs, but when they are done properly, they can be the difference between users purchasing on your site over a competitor with complicated navigation.

Take the first steps towards improving your customers’ experience and request a free website review.

FAQs

Are Breadcrumbs Good for User Experience?

Yes, breadcrumbs are generally good for user experience. The breadcrumb path provides links so that users can easily navigate between pages. This saves time searching for specific information and provides a clear visual of where users are located within the website structure.

Are Breadcrumbs Still Important for SEO?

While not crucial for all websites, breadcrumbs can still be important for SEO. They improve internal linking on the website and help search engines discover, crawl, and index pages.

What Is the Difference Between Sitemap and Breadcrumbs?

A sitemap is a map of all the pages available on a website, whereas breadcrumbs provide a visual path indicating where a user is located within the website’s architecture. The breadcrumb path usually includes just a few pages.

For example: Home > Car Services > Tyres > Wheel Alignment.

When To Use Breadcrumbs?

Not every website will need breadcrumbs, but they should be used as an alternative way for users to navigate a website. Use breadcrumbs if you think it will improve user experience.

Breadcrumbs are useful on larger sites, such as e-commerce. They should be used to support the navigational menu – not instead of a menu.

What Type of Sites Typically Use Breadcrumbs?

Larger websites that contain lots of pages and sites that are structured in terms of hierarchy can benefit from using breadcrumbs. Examples of typical sites that may use breadcrumbs include e-commerce sites, blogs, educational, and healthcare websites.