Breadcrumbs represent the hierarchy of a website’s content relative to the page that a user is viewing, e.g. ‘Home : Musical Instruments : Guitars : Electric Guitars’. In a sense, breadcrumbs display the shortest standard click-path from a site’s homepage to another given page. Breadcrumbs almost always appear on the left side of a page, below the main navigation and above the page’s content. Each element in the list is usually a link to that section of the site.
Pros
- Breadcrumbs prevent users from getting lost on a site by providing a concise explanation of where they are.
- They enhance users understanding of how a site is structured.
- Breadcrumb links provide users with shortcuts to other sections of the site.
Cons
- Breadcrumbs only represent one path to a given page, but content frequently ‘lives’ in multiple places on a site. (ex: A news article about cars used in films would exist in the ‘Automotive’ and ‘Film’ sections of the site.) If this article were featured on the new site’s homepage, it is unclear what path the breadcrumbs would display.
- If breadcrumbs are hard-coded, they may not represent the path that a user took to arrive at the page.
Rules of Thumb
- Place breadcrumbs above a page’s content and below its navigation.
- Make the items in the breadcrumb trial hyperlinks to the corresponding pages.
- Include all important landing pages