Why are breadcrumb links included as an element of so many websites?
Ask a developer and she’s likely to say it’s because a textual representation of the hierarchy of the site gives users a sense of place. Like a big red star that says “You Are Here” on a map, breadcrumbs help people figure out where they are in a site and how to navigate it.
Ask a site visitor and you’re likely to get a very different answer. So in 2002 that’s exactly what Kathryn Summers, Cheri Smith and I did. We studied 14 participants with varying web skill levels find information on sites that used breadcrumbs: three sites used location breadcrumbs, one used path breadcrumbs, and one used attribute breadcrumbs on the search results page only. Here’s what we did: we’d ask them to find a particular item, say, the movie “Pitch Black.” Then we asked them to find a related item, like what other horror DVDs the site had. Breadcrumbs were one way they could have navigated to the related item.
We wanted to find out whether people notice, use, and understand what breadcrumbs are.
So, what are breadcrumbs?
Keith Instone defined three types of breadcrumb links; each describes different characteristics of a Web site:
- Location breadcrumbs indicate the position of the current page within a site’s hierarchy.
- Path breadcrumbs show the pages the user visited to get to the current page. A page can have different path breadcrumbs because users can take different routes.
- Attribute breadcrumbs convey product meta-information, such as subject, price, category, style and brand.
Do people notice breadcrumbs?
Yes, they do.
We never asked participants about breadcrumbs until we observed them hovering over a breadcrumb or clicking on it. Only after a task was complete would we ask questions about why they had used that link, what they thought it was, and why it was there.
Thirteen out of 14 participants (93%) clicked on a breadcrumb at least once during the session. Of the 175 tasks given during the study, breadcrumbs were used during 22% of them. Four participants used breadcrumb links repeatedly as a navigation strategy.
Do they use breadcrumbs?
Again, yes. But what we found interesting was why they do or don’t use them: when it seemed that clicking the breadcrumb link would be the fastest way to get to what they wanted.
There are multiple ways to get to a related page in a site, but our users seemed to group them into three approaches:
- Using the “back” button to get to a previously visited page
- Clicking on a link
- Entering a keyword into the search box
Some participants said that the back button was “safer” than breadcrumb links because they knew what page would come up when clicking “back”. Using a breadcrumb link introduces an element of risk since the user may not have visited that page previously. (An interesting aside, visited links didn’t seem to be enough of a visual cue to indicate to users that they had, indeed, visited that page before.) One participant described it this way, “It’s safer to push ‘back’ because I know what I’ve seen. If I push this [breadcrumb link] I don’t know if I’m going to get what I got before. I don’t want to waste any time.”
They sometimes saw breadcrumb links as a way to get to a desired page more quickly. That mitigated that risk of not going back to a previously visited page for some participants. For example we often saw, after clicking through several pages of search results without finding the desired item, participants use breadcrumbs instead of clicking on the back button repeatedly to get back to where they wanted to be. When asked about how she decided to use breadcrumbs instead of the back button, one participant responded, “clicking ‘back-back’ is too much work.” We found that when deciding between using the back button and a link in the breadcrumb trail, participants tended to use whatever they thought was the fastest way.
When the breadcrumb’s link text is exactly what the user is looking for, they’ll often gamble that clicking on the breadcrumb link will get them there faster than any other method, like hitting the back button or going to search.
The scenario where breadcrumbs were used most consistently was during the task of locating other “horror” DVDs. After finding the Pitch Black DVD page on the Walmart.com site, participants were asked to locate other available horror DVDs on the site. Nine out of 14 users (64%) noticed the breadcrumb labeled “horror” and clicked on it during this task. When asked what they had clicked on and why, they generally responded that they were looking for the term, “horror”, happened to find a link to it on their way to using the back button or the search box, and clicked on it.
Do they understand what breadcrumbs are?
Well, yes and no. The answer depends on what type of breadcrumb you’re talking about.
- Location breadcrumbs: Nine out of 14 participants gave a correct description of location breadcrumbs, saying that these indicate their location in the site. But the other five incorrectly described the location breadcrumbs as the path they took to get here.
- Describing path breadcrumbs: Only two participants encountered path breadcrumbs during their session. We weren’t able to get them to articulate what they thought these were, so we’ll chalk this one up as “unknown.”
- Describing attribute breadcrumbs: Two participants encountered attribute breadcrumbs and correctly described them as indicating how they could have gotten to the current page or how to get to more items like this.
How to use breadcrumbs in a web site
Based on watching how people actually use breadcrumb link, we think the study suggests a couple of recommendations for how to implement them in a Web site. These may seem obvious, but I’m consistently surprised by sites that don’t do these basic things:
- The labels used in a breadcrumb trail should use keywords for which users are likely to be looking.
- They should be links to enable users to skip to desired content quickly.
- They should accurately describe the destination page they link to.
This study was conducted back in 2002. Do people use breadcrumbs differently now that they have become a more established convention and folks are more likely to know how they work? How do people use breadcrumbs on your site?
For more research on the use of breadcrumb links, check out the following sources:
- Bowler, D., Ng, W., and Schwartz, P. (2001) Navigation bars for hierarchical websites
- Instone, K. (2002) Location, path & attribute breadcrumbs (pdf)
- Krug, S. Don’t make me think! Indianapolis: New Riders Publishing (2000)
- Lazar, N. & Eisenbrey, M. (2000) Website structural navigation
- Lida, B., Hull, S., and Pilcher, K. (2003) Breadcrumb navigation: an exploratory study of usage
- Rogers, B. and Chaparro, B (2003) Breadcrumb navigation: Further investigation of usage
- Maldonado, C.A. & Resnick, M.L. (2002) Do common user interface design patterns improve navigation? Proceedings of the Human Factors and Ergonomics Society 46th Annual Meeting, 1315-1319.