Pattern: Homeward path. Also known as: Breadcrumb, Trail marker.
Yahoo offers a double path. The upper path functions as page title and repeats the last 2 items from the page path. --http://www.yahoo.com (Jul 2003)
Problem
Sites can have many levels of information, making it difficult for visitors to orientate, especially when they are coming from a deep link or search engine.
Motivation
The site's main navigation does not always show how a page is related to other pages. A site can have multiple navigation schemes, or a two-level tab navigation that hides the actual complexity of the site.
When the user performs a search, he does not use the main navigation but jumps directly to a page, so he can loose sense of location easily.
On websites with 3 levels or more, users need a fallback navigation method if other navigation methods (menu, search) fail.
Solution
Create a row of links that shows the hierarchical path from the homepage to the current page.Diagram
Use when
On all sites with 3 levels or more.Implementation
- Provide a textual cue, such as You are here:, so the meaning of the row of links is easy to understand. You can also insert text cues before each link (see Anne Frank below).
- Use an obvious separator that suggests a sequential order, like > or / or :
- Homeward path is most often used at the top of the page, but sometimes you find them at the bottom of the page (see Apple below). In that case it should be placed near the search box.
- A vertical listing is confusing because it looks like a menu.
- Homeward path does not always link back to the homepage, but a local path is used instead (see examples from Amazon and Nokia).
- The links should always be presented as secundary information to the main navigation. Use a smaller font and non-obtrusive colors. With the exception of directory sites such as Yahoo or the Google directory, where the path can be presented as primary information.
Discussion
- The ubiquitous term Bread crumb is confusing and leads to incorrect assumptions (Donald_Norman would say: creates a wrong mental model) - some people think that bread crumbs show the path the user has taken so far. So I propose the new term Homeward path. -- Main.ArthurClemens - 01 Jul 2003
- The study in the article Breadcrumb Navigation: An Exploratory Study of Usage (Feb 2003, publ. May 2003) shows that usage of the breadcrumb is low, and that users using breadcrumbs did not navigate more efficiently. The usability research was limited in scale and needs to be expanded to reach definite conclusions.
- The follow-up research confirms that users are using the breadcrumb sparingly, if at all, and that "no differences were found in the efficiency measures of total pages visited, navigation bar clicks, embedded link clicks, or time to complete the search tasks". "Future studies should investigate whether a simple understanding of the purpose of the breadcrumb trail or minimal training impacts usage and/or efficiency". The research does show increasing usage if the breadcrumb is positioned near the content. Exposure to a breadcrumb does let users form a hierarchical mental model of the site.
Examples
1.
Click on Image to see large image.
2.
Click on Image to see large image.
