A breadcrumb or breadcrumb trail is a graphical control element frequently used as a navigational aid in user interfaces and on web pages. It allows users to keep track and maintain awareness of their locations within programs, documents, or websites.
The term originates from the trail of bread crumbs left by Hansel and Gretel in the fairy tale of the same name.
Usage
A breadcrumb trail tracks and displays each page viewed by a visitor of a website, either in the order the pages were viewed, or in other definitions, displaying a hierarchy of the current page in relation to the website’s structure. Breadcrumbs are typically placed in horizontal form under the masthead or navigation of a website.
Websites
Breadcrumbs typically appear horizontally across the top of a Web page, often below title bars or headers. They provide links back to each previous page the user navigated through to get to the current page or—in hierarchical site structures—the parent pages of the current one. Breadcrumbs provide a trail for the user to follow back to the starting or entry point.[1] A greater-than sign (>) often serves as hierarchy separator, although designers may use other glyphs (such as » or ›), as well as various graphical icons.
A breadcrumb trail or path based on viewing history is typically rendered as follows :
Page viewed > Page viewed > Page viewed > Page currently being viewed
For instance, in this scenario, a website visitor views seven pages (note how the pages are tracked in order the user viewed them) :
Home page > Services > About Us > Page currently being viewed
Typical breadcrumbs following a hierarchical structure are shown as follows:
Home page > Section page > Subsection page
Types:
There are three types of Web breadcrumbs:
- Location: location breadcrumbs are static and show where the page is located in the website hierarchy.
- Attribute: attribute breadcrumbs give information that categorizes the current page.
- Path: path breadcrumbs show users the steps they took to end up on current page.