Breadcrumb navigation

Last updated
KDE's Dolphin (file manager), demonstrating its implementation of location-based breadcrumb navigation in the "usr", "local" and "etc" folder buttons. The arrows can also be clicked to expand selection. Kde breadcrumb nav.png
KDE's Dolphin (file manager), demonstrating its implementation of location-based breadcrumb navigation in the "usr", "local" and "etc" folder buttons. The arrows can also be clicked to expand selection.

A breadcrumb or breadcrumb trail is a graphical control element 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 alludes to the trail of bread crumbs left by Hansel and Gretel in the German fairy tale. [1]

Contents

Usage

A breadcrumb trail tracks and displays each page viewed by a visitor of a website, either in the order the pages were viewed, [2] or in other definitions, displaying a hierarchy of the current page in relation to the website's structure. [3] Breadcrumbs are typically placed in horizontal form under the masthead or navigation of a website. [4]

They may be implemented with each part of the trail having a drop-down menu of its own, as well as drag and drop support, as done in Windows Explorer.

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 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 > Home page > Latest Newsletter > Home page > Page currently being viewed

Typical breadcrumbs following a hierarchical structure are shown as follows:

Home page > Section page > Subsection page

Software

Current file managers including Linux Mint's Nemo, Windows Explorer (from Windows Vista onwards), Finder (for Macintosh operating systems), GNOME's Nautilus, KDE's Dolphin, Xfce's Thunar, MATE's Caja, and SnowBird allow breadcrumb navigation, often replacing or extending an address bar.[ citation needed ]

Types

There are three types of web breadcrumbs: [5] [6]

Usability

Location breadcrumbs are not necessarily appropriate for sites whose content is so rich that single categories do not fully describe a particular piece of content. For this reason, a tag may be more appropriate, though breadcrumbs can still be used to allow the user to retrace their steps and see how they arrived at the current page.

Other names

Some commentators and programmers alternatively use the term "cookie crumb" as a synonym to describe the navigation design. This is not the same thing as HTTP cookies (text files websites write on a visitor's machine that record data such as login information).

Michigan Community College's Virtual Learning Collaborative uses the term "Navigation Path", [7] as do some Drupal users. [8]

French and Spanish speakers sometimes use instead the term Ariadne's thread (in French fil d'Ariane) in relation to the thread left by Ariadne to Theseus so he can find the exit of the labyrinth after killing the Minotaur, on a LIFO (stack) instead of FIFO (queue) way.[ citation needed ]

Related Research Articles

A file manager or file browser is a computer program that provides a user interface to manage files and folders. The most common operations performed on files or groups of files include creating, opening, renaming, copying, moving, deleting and searching for files, as well as modifying file attributes, properties and file permissions. Folders and files may be displayed in a hierarchical tree based on their directory structure.

<span class="mw-page-title-main">Graphical user interface</span> User interface allowing interaction through graphical icons and visual indicators

A graphical user interface, or GUI, is a form of user interface that allows users to interact with electronic devices through graphical icons and visual indicators such as secondary notation. In many applications, GUIs are used instead of text-based UIs, which are based on typed command labels or text navigation. GUIs were introduced in reaction to the perceived steep learning curve of command-line interfaces (CLIs), which require commands to be typed on a computer keyboard.

<span class="mw-page-title-main">Konqueror</span> Web browser and file manager

Konqueror is a free and open-source web browser and file manager that provides web access and file-viewer functionality for file systems. It forms a core part of the KDE Software Compilation. Developed by volunteers, Konqueror can run on most Unix-like operating systems. The KDE community licenses and distributes Konqueror under GNU GPL-2.0-or-later.

<span class="mw-page-title-main">Hyperlink</span> Method of referencing visual computer data

In computing, a hyperlink, or simply a link, is a digital reference to data that the user can follow or be guided to by clicking or tapping. A hyperlink points to a whole document or to a specific element within a document. Hypertext is text with hyperlinks. The text that is linked from is known as anchor text. A software system that is used for viewing and creating hypertext is a hypertext system, and to create a hyperlink is to hyperlink. A user following hyperlinks is said to navigate or browse the hypertext.

<span class="mw-page-title-main">Drupal</span> Web content management system

Drupal is a free and open-source web content management system (CMS) written in PHP and distributed under the GNU General Public License. Drupal provides an open-source back-end framework for at least 14% of the top 10,000 websites worldwide and 1.2% of the top 10 million websites—ranging from personal blogs to corporate, political, and government sites. Drupal can also be used for knowledge management and for business collaboration.

<span class="mw-page-title-main">File Explorer</span> File manager application that is included with releases of the Microsoft Windows operating system

File Explorer, previously known as Windows Explorer, is a file manager application and default desktop environment that is included with releases of the Microsoft Windows operating system from Windows 95 onwards. It provides a graphical user interface for accessing the file systems, as well as user interface elements such as the taskbar and desktop.

<span class="mw-page-title-main">Toolbar</span> Element of computer graphical interfaces

The toolbar, also called a bar or standard toolbar, is a graphical control element on which on-screen icons can be used. A toolbar often allows for quick access to functions that are commonly used in the program. Some examples of functions a toolbar might have are open file, save, and change font. Toolbars are usually distinguished from palettes by their integration into the edges of the screen or of other windows. This can result in wasted space if multiple underpopulated bars are stacked atop each other or interface inefficiency if overloaded bars are placed on small windows.

<span class="mw-page-title-main">Graphical widget</span> Element of interaction in a graphical user interface

A graphical widget in a graphical user interface is an element of interaction, such as a button or a scroll bar. Controls are software components that a computer user interacts with through direct manipulation to read or edit information about an application. User interface libraries such as Windows Presentation Foundation, Qt, GTK, and Cocoa, contain a collection of controls and the logic to render these.

<span class="mw-page-title-main">Banner blindness</span> Tendency to ignore banner-size notices

Banner blindness is a phenomenon in web usability where visitors to a website consciously or unconsciously ignore banner-like information. A broader term covering all forms of advertising is ad blindness, and the mass of banners that people ignore is called banner noise.

<span class="mw-page-title-main">Breadcrumbs</span> Residue of dried bread

Breadcrumbs consist of crumbled bread of various dryness, sometimes with seasonings added, used for breading or crumbing foods, topping casseroles, stuffing poultry, thickening stews, adding inexpensive bulk to soups, meatloaves and similar foods, and making a crisp and crunchy covering for fried foods, especially breaded cutlets like tonkatsu and schnitzel. The Japanese variety of breadcrumbs is called "panko".

<span class="mw-page-title-main">SlipKnot (web browser)</span>

SlipKnot was one of the earliest World Wide Web browsers, available to Microsoft Windows users between November 1994 and January 1998. It was created by Peter Brooks of MicroMind, Inc. to provide a fully graphical view of the web for users without a SLIP or other TCP/IP connection to the net, hence the name – SLIP...not. SlipKnot provided a graphical web experience through what would otherwise be a text-only Unix shell account. SlipKnot version 1.0 was released on November 22, 1994, approximately 3 weeks before Netscape's Netscape Navigator version 1.0 came out. It was designed to serve a significant fraction of PC/Windows-based Internet users who could not use Mosaic or Netscape at that time.

A navigation bar is a section of a graphical user interface intended to aid visitors in accessing information. Navigation bars are implemented in operating systems, file browsers, web browsers, apps, web sites and other similar user interfaces.

Web analytics is the measurement, collection, analysis, and reporting of web data to understand and optimize web usage. Web analytics is not just a process for measuring web traffic but can be used as a tool for business and market research and assess and improve website effectiveness. Web analytics applications can also help companies measure the results of traditional print or broadcast advertising campaigns. It can be used to estimate how traffic to a website changes after launching a new advertising campaign. Web analytics provides information about the number of visitors to a website and the number of page views, or create user behavior profiles. It helps gauge traffic and popularity trends, which is useful for market research.

<span class="mw-page-title-main">HTTP cookie</span> Small pieces of data stored by a web browser while on a website

HTTP cookies are small blocks of data created by a web server while a user is browsing a website and placed on the user's computer or other device by the user's web browser. Cookies are placed on the device used to access a website, and more than one cookie may be placed on a user's device during a session.

<span class="mw-page-title-main">Directory (computing)</span> File system structure for locating files

In computing, a directory is a file system cataloging structure which contains references to other computer files, and possibly other directories. On many computers, directories are known as folders, or drawers, analogous to a workbench or the traditional office filing cabinet. The name derives from books like a telephone directory that lists the phone numbers of all the people living in a certain area.

A local shared object (LSO), commonly called a Flash cookie, is a piece of data that websites that use Adobe Flash may store on a user's computer. Local shared objects have been used by all versions of Flash Player since version 6.

The front controller software design pattern is listed in several pattern catalogs and is related to the design of web applications. It is "a controller that handles all requests for a website," which is a useful structure for web application developers to achieve flexibility and reuse without code redundancy.

Web tracking is the practice by which operators of websites and third parties collect, store and share information about visitors’ activities on the World Wide Web. Analysis of a user's behaviour may be used to provide content that enables the operator to infer their preferences and may be of interest to various parties, such as advertisers. Web tracking can be part of visitor management.

<span class="mw-page-title-main">User journey</span>

A user journey is the experiences a person has when interacting with something, typically software. This idea is generally used by those involved with user experience design, web design, user-centered design, or anyone else focusing on how users interact with software experiences. It is often used as a shorthand for the overall user experience and set of actions that one can take in software or other virtual experiences.

<span class="mw-page-title-main">Web navigation</span> Following hyperlinks on the World Wide Web

Web navigation refers to the process of navigating a network of information resources in the World Wide Web, which is organized as hypertext or hypermedia. The user interface that is used to do so is called a web browser.

References

  1. 1 2 Mark Levene (18 October 2010). An Introduction to Search Engines and Web Navigation (2nd ed.). Wiley. p. 221. ISBN   978-0470526842 . Retrieved 12 November 2012.
  2. "Breadcrumb Navigation | Spidergems". Spidergems. 27 April 2018. Retrieved 2018-04-27.
  3. Demetri (4 June 2012). "16 Important Do's and Don'ts of Effective Web Design". Design Toronto Web. Retrieved 21 June 2016.
  4. Martini, Brands (October 26, 2018). "Everything You Need To Know About Breadcrumbs". Brands Martini.
  5. "Breadcrumbs In Web Design: Examples And Best Practices". Smashing Magazine. 17 March 2009.
  6. "Breadcrumb Navigation: Good for Website Usability or Not?". Usabilla Blog. 28 September 2016.
  7. MCCVLC Black Board Help
  8. Setting the Navigation Path by Context in Drupal