Are breadcrumbs useful when a page can be found in multiple locations?

Written by Matt Keogh on 10th September 2018

No comments
Hansel & Gretel

In general, breadcrumbs work to show where the user is within the hierarchy of a website and to provide a way to explore other areas. Depending on the type of breadcrumb it can also be used to show a user where they have come from and provide another way for them to go “back”.

A simple example of this could be:

Home > Products > Furniture > Oak Table

A problem arises when a page can appear in more than one place. So in my example, there might be a single page “Oak Table” but the website hierarchy means it could live in multiple places:

Home > Products > Furniture > Oak Table

And

Home > Products > Oak > Oak Table

Here the simple hierarchy no longer applies as it is no longer location/folder based.

What are the options?

1) Have multiple pages (So the physical page “Oak Tables” appears at multiple URLs ). 

Best avoided as it may be seen as duplicate content and confuse users.

2) Display multiple breadcrumbs

Although Google is OK with this, I’ve never seen a tidy implementation and it’s potentially confusing for users.

3) Choose it’s rightful place and always show that in the breadcrumb

Here you decide that the ‘Oak Table’ page lives in a certain location. So for example structurally it lives in the “Oak” folder. No matter which path the user took, the breadcrumb always shows the “Oak” link.

The main issue here is that a user might have followed a path that is different to the one shown in the breadcrumb.

4) Choose a breadcrumb that isn’t hierarchical

Here we accept that the hierarchical breadcrumb (based off a folder structure) doesn’t make sense. Instead we decide on something else that makes sense such as

Home >  Products  > Oak Table

Or maybe even:

Home >  Products  > Wooden Furniture > Oak Table

Here the last part (“products” or “Wooden Furniture”) are less to do with the actual path and more to do with giving the user somewhere sensible to go, no matter their journey into the page.

5) Use a path or “history” based breadcrumb

Here you log each user’s actual path through the site, building up the breadcrumb dynamically based on which path they have come through. So for example one user might see:

Home >  Products > Furniture > Oak Table

And another might see

Home > Products > Oak > Oak Table

Apart from technical issues, it can still be confusing for visitors as the hierarchy of the page may not be what’s expected and doesn’t get around the issue of people coming to it directly (from a search engine for example).

As an aside, when the last page a user visits was a results page, an adaption of this would be to add a history based link back to the results. That way they can go forward to a page and back to the results without using the back button.

< Back to Results | Home > Products > Oak > Oak Table

6) Attribute based breadcrumb

As soon as you have a page that could potentially live in two places, it is no longer hierarchy based. As the breadcrumb/URL are divorced you could use something based around attributes. E.g.

Home > Products > Oak Table
Appears in "Oak" and "Furniture"Article

Another attribute based breadcrumb often appears on results pages so that you can build up a breadcrumb here too:

Home > Products > Oak[x] or Furniture[x] > Results 

Think clearly about each use case

Breadcrumbs have been around since the dawn of the web when most sites were simple and involved putting files in folders on a server. With much more complex sites and structures it’s important to think clearly about each use case and understand the reason it’s there and how it can help the user.


Useful links

Do people use the back button?

There’s an argument that in the age of mobile apps and in-page navigation such as tabbed content, users are using the the back button less. The latest research I could find was from Firefox that shows that 93.1 percent of users clicked the button at least once over the course of a five-day period

Other breadcrumb related links

This article was posted in Design, UX by Matt Keogh

  • Matt Keogh

    Matt Keogh

    Matt is our Senior Designer who is perfect at pixel placement. At the weekend he likes to kick back, watch a film or two and spend time with his family (or so he tells us!). @matsaukeo

Comments

No comments have yet been posted, be the first to comment by using the form below:

Post a comment

*
*
You are currently offline. Some pages or content may fail to load.