When it comes to keeping track of where your users are in their website experience, you may well need breadcrumbs.

Just like the fairy tale children Hansel and Gretel, who dropped breadcrumbs to find their way back home through the forest, website users can find their way back to the point they joined your site using a visual trail.

 

What are breadcrumbs and why are they used?

 

Breadcrumbs are a method of secondary navigation on a website – a visual path which visitors can follow. Having a breadcrumbs trail is like users consulting a map of your site and finding a pin with the words: You are here. They’re most often used on websites where there is a great deal of content, and in web applications where there is more than one step. They can be horizontal links which show text and are separated by the symbol for ‘greater than’, >, a forward slash, /, or arrows. They’re generally smaller than the primary navigation menu, and found underneath it. Breadcrumbs allow website visitors to access higher-level pages with fewer actions. They don’t have to use a back button, for example.

There are three main types: location-based; attribute-based; path-based.

Location-based breadcrumbs show your users where they are within your site’s hierarchy. Our customer, Adp Group Ltd, uses clear, effective, and simple forward slashes to show users where they are on its site with location-based breadcrumbs: http://adpgroupltd.com/about-us/our-people/

Attribute-based breadcrumbs show the attributes of the items on your page.

Path-based breadcrumbs show your users the steps they’ve taken to get to a particular page.

They shouldn’t replace your primary navigation menu – that’s something your site’s users will expect. It’s all about enhancing the experience, rather than taking something away and making your site less user-friendly.

 

Where are they most useful?

 

E-commerce sites often have large groupings of products organised into categories. Visitors often want to browse these categories and return to items they’ve seen earlier to compare prices or product specs.

If you have a site where there are different steps to paying for goods or registering for a new account, breadcrumbs help users know where they are in the process.

They’re also a useful tool to bring visitors into a number of pages from an initial Google search, tempting users to click onto higher level pages. That could help reduce a site’s bounce rate.

 

The benefits

 

Google has announced that real world website names and breadcrumbs navigation paths will be showing up more in desktop search results in the future – as they already do in mobile search results.

Marking up the breadcrumbs information on a web page can help Google’s crawlers understand the page’s contents. Read more about it here: https://developers.google.com/structured-data/breadcrumbs?hl=en&rd=1#about_breadcrumbs

They’ve been around for a long time and people instinctively understand how to use them, and they don’t impinge on page content. They’re small and useful.

The drawbacks

 

They take extra time to code, so they’re probably not worth it if you have a small site with few pages, or a site where there’s no categorisation or hierarchy. There are also some sites where items are in multiple categories. On news websites, you might find a story categorised both in news and features, and in an area category, for example. A breadcrumb trail there could be confusing.

 

So when you make up your mind about using web design’s unsung SEO heroes, you have to ask one key question: will my web users benefit? If the answer’s yes, bring on the breadcrumbs.