Breadcrumb navigation
Breadcrumb navigation or breadcrumb navigation ( English breadcrumbs , breadcrumb navigation , breadcrumb trail ) is a design pattern for the design of graphical user interfaces . It is usually a line of text that shows the user in which branch he is within an application.
Breadcrumbs show the path to the current item, for example the website or category in the catalog. Breadcrumb navigation is intended to improve orientation within deeply branched element trees by offering links to higher-level or related elements. Often these are designed as buttons.
The name breadcrumb navigation was based on the fairy tale Hansel and Gretel , in which the children led into the forest scatter breadcrumbs on the way to find their way back.
The navigation line is sometimes also referred to as the Ariadne path . This name is borrowed from Greek mythology. Ariadne gave Theseus a ball of wool which he unrolled in the labyrinth of Daidalos . With the help of this Ariadne thread he found his way out of the labyrinth again.
Location
Location breadcrumbs show the current position of an element relative to the root element. This means that the visitor can see at a glance in which element branch the current element is located.
Example:
Root category (catalog) → sub-category 1 → sub-category 1.3 → ...
Path
Path breadcrumbs show the most recently accessed elements one after the other. In this way, the user sees the route on which he has reached the current element.
Example:
Sub-category 2.1 → Home → Category 1 → Category 3
Attributes (property)
Attribute breadcrumbs use meta-information to show several different navigations, each of which leads to the currently accessed element.
Example:
Home → Germany → Bavaria → Culinary → Roast pork
Home → Food → Main dishes → Meat → Roast pork
Keywords: Roast, meat, Bavaria, food
Design in Linux
With many Linux programs - in particular file managers and file dialogs - you can choose between a path bar style with buttons and an address bar style in which the path is a pure text line.
File manager with breadcrumb function
Web links
- Usability-Tipps.de: Breadcrumbs - "breadcrumbs" for improved usability
- Barrierefreies-Webdesign.de: A supplementary guide: The breadcrumb navigation (2011, updated 2016)
- Jakob Nielsen: Breadcrumb Navigation Increasingly Useful (English)
- Breadcrumb Navigation: Further Investigation of Usage (English)
- Influence of training and exposure on the Usage of Breadcrumb Navigation (English)