Brotkrümelnavigation oder Brotkrumennavigation (englisch breadcrumbs, breadcrumb navigation, breadcrumb trail) ist ein Entwurfsmuster für die Gestaltung grafischer Benutzeroberflächen. Üblicherweise ist es eine Textzeile, die dem Benutzer anzeigt, in welcher Verzweigung er sich innerhalb einer Applikation befindet.
Brotkrümel zeigen den Pfad zum aktuellen Element, beispielsweise zu der Webseite oder Kategorie im Katalog. Die Navigation soll die Orientierung innerhalb tief verzweigter Elementbäume verbessern, indem sie Links zu übergeordneten oder themenverwandten Elementen anbieten. Oft sind diese als Schaltflächen ausgestaltet.
Der Name Brotkrümelnavigation wurde in Anlehnung an das Märchen Hänsel und Gretel gebildet, in dem die in den Wald geführten Kinder Brotkrumen auf den Weg streuen, um den Weg zurückzufinden.
Mitunter wird die Navigationszeile auch als Ariadnepfad bezeichnet. Diese Bezeichnung ist der griechischen Mythologie entlehnt. Ariadne schenkte Theseus ein Wollknäuel, das er im Labyrinth des Daidalos abrollte. Mit Hilfe dieses Ariadnefadens fand er wieder aus dem Labyrinth heraus.
Bearbeiten
Location (Ort) Bearbeiten
Location-Breadcrumbs zeigen die aktuelle Position eines Elements relativ zum Wurzelelement an. Damit sieht der Besucher auf einen Blick, in welchem Element-Zweig sich das aktuelle Element befindet.
Beispiel:
Wurzelkategorie (Katalog) → Unterkategorie 1 → Unterkategorie 1.3 → …
Path (Pfad) Bearbeiten
Path-Breadcrumbs zeigen die zuletzt aufgerufenen Elemente nacheinander an. Der Benutzer sieht so den Weg, auf dem er das aktuelle Element erreicht hat.
Beispiel:
Unterkategorie 2.1 → Startseite → Kategorie 1 → Kategorie 3
Attribute (Eigenschaft) Bearbeiten
Attribute-Breadcrumbs zeigen anhand von Meta-Informationen mehrere unterschiedliche Navigationen, die jeweils zum aktuell aufgerufenen Element führen.
Beispiel:
Startseite → Deutschland → Bayern → Kulinarisches → Schweinebraten
Startseite → Essen → Hauptgerichte → Fleisch → Schweinebraten
Schlagwörter: Braten, Fleisch, Bayern, Essen
Dateimanager mit Breadcrumb-Funktion Bearbeiten
Weblinks Bearbeiten
- Usability-Tipps.de: Breadcrumbs – „Brotkrümel“ für eine verbesserte Usability
- Barrierefreies-Webdesign.de: Eine ergänzende Orientierungshilfe: Die Brotkrumen-Navigation (2011, 2016 aktualisiert)
- Jakob Nielsen: Breadcrumb Navigation Increasingly Useful (englisch)