Breadcrumbs - Navigationspfade

Breadcrumbs - Alles begann mit Hänsel und Gretel und endete in einer Brotkrümelnavigation in Webseiten

„Breadcrumbs“ ist zugegebenermaßen einer der merkwürdigsten Begriffe im Internet. Die meisten Internet-Nutzer würden Brotkrümel bzw. Brotkrumen nicht im Entferntesten mit dem Web in Verbindung bringen.

Breadcrumbs

Trotzdem kommst Du als Web-User fast täglich mit Breadcrumbs in Kontakt. Unter Breadcrumbs wird die sekundäre Form der Navigation auf einer Website verstanden. Deshalb wird anstelle des Wortes „Breadcrumbs“ auch häufig der Begriff „Breadcrumb-Navigation“ oder "Breadcrumb-Trail" verwendet.

Bei der Breadcrumb-Navigation handelt es sich schlicht und einfach um einen Link-Pfad, der dem Nutzer einer Webseite anzeigt, wo er sich innerhalb der Seitenstruktur der Seite befindet und ihm dadurch die Navigation vereinfacht. Die Breadcrumb-Navigation ist in der Regel seitenhierarchisch aufgebaut und zeigt dem Besucher einer Webseite den logischen Pfad von der Homepage bis zur aktuell besuchten Unterseite. Üblicherweise befinden sich diese in oberen Bereich einer Webseite und geben die interne Verlinkung wieder.

Mit der Erklärung, was ein Breadcrumb ist, erschließt sich auch die Herkunft des Begriffs. Der Name ist eine Anspielung auf das Märchen „Hänsel und Gretel“. Die beiden Kinder streuten in der Geschichte der Gebrüder Grimm Brotkrumen auf den Pfad, um den Weg zurück nach Hause zu finden. Und genauso sollen Breadcrumbs Website-Usern den Weg durch eine Webseite weisen.

Was bringt eine Breadcrumb-Navigation?

Wie bereits einleitend dargestellt, ist die Hauptfunktion die Orientierung des Nutzers. In vielen Fällen gelangen User über eine Suchmaschine wie Google oder eine sonstige Verlinkung auf eine Unterseite einer Website. Vor allem, wenn der Nutzer von Google auf eine ihm unbekannte Seite gelangt, hat er möglicherweise Schwierigkeiten, sich darauf schnell zurechtzufinden. Ein Breadcrumb erleichtert dem User die Orientierung, da sie ihm auf einen Blick zeigen, wo er sich gerade in der Seitenstruktur einer Website befindet. So weißt Du beispielsweise beim Lesen  (Homepage > Herren > Bekleidung > Shirts) dass Du Dich in der Unterkategorie „Shirts“ im Bereich „Herrenbekleidung“ eines Onlineshops befindest.

Neben der Orientierungsfunktion ist die zweite Hauptfunktion die Inspiration. Ein Breadcrumb verleiten viele Nutzer dazu, sich durch eine Website zu klicken und sich andere Unterseiten anzusehen. So erhöhen es nicht nur die Verweildauer von Nutzern auf einer Webseite, sondern auch die Conversion-Rate. Das oben genannte Breadcrumb mag Dich beispielsweise dazu verleiten, Dir auch noch andere Unterseiten im Bereich der Herrenbekleidung anzusehen.

Welche Arten der Breadcrumb-Navigation gibt es?

Es existieren drei Arten: Ort (Location), Pfad (Path) und Attribut (Attribute). Welcher dieser drei Arten der Navigation auf einer Website zum Einsatz kommt, hängt sowohl von der Struktur als auch von der Zielsetzung der Seite ab.

Bei ortsbezogenen (location-based) Breadcrumbs gibt das Breadcrumb die aktuelle Position des Users in der Hierarchie der Website an. Diese Art der Breadcrumb-Navigation findest Du besonders häufig bei großen, streng hierarchisch aufgebauten Websites mit einer Vielzahl von Unterebenen. So könnte ein ortsbezogenes Breadcrumb einer Reise-Webseite folgende Struktur haben: Startseite > Europa > Deutschland > Nordrhein-Westfalen > Köln > Kölner Dom.

Bei einer pfadbezogenen (path-based) Breadcrumb-Navigation zeigt das Breadcrumb den Klickpfad des Users an, über den er zu seiner aktuellen Position gelangt ist. Diese Art der Navigation wird aus zwei Gründen eher selten angewendet. Zum einen kann der Klickpfad bei komplexen Seiten sehr lange werden und zum anderen erfüllen die Vor- und Zurück-Buttons des Webbrowsers im Grund genommen die gleiche Funktion.

Attributbezogene (attribute-based) Breadcrumbs zeigen die Attribute einer bestimmten Unterseite an. Im Gegensatz zu den ortsbezogenen Breadcrumbs weisen sie nicht auf die aktuelle Position auf der Website, sondern liefern dem Nutzer Meta-Daten. Diese Art der Breadcrumb-Navigation wird häufig von Onlineshops verwendet. Ein Beispiel für ein attributbezogenes Breadcrumb wäre Home > Oberbekleidung > Shirts > Herren > XL > blau.

Wo kann man Breadcrumbs einsetzen?

Die Breadcrumb-Navigation hat sich in den letzten Jahren als Standard etabliert und wird auf fast jeder Website angezeigt. Vor allem bei sehr großen Websites und Portalen, die in der Regel eine recht komplexe hierarchische Struktur aufweisen, bietet sich die Brotkrumen-Navigation zur Orientierung der User an. Auch für Onlineshops aller Größenordnungen und einem Content Management System (CMS) ist eine derartige sekundäre Navigationshilfe von Vorteil.

Lediglich bei kleinen Webseiten und bei Seiten ohne logische Hierarchie ist von einer Brotkrumen-Navigation eher abzuraten. Wichtig ist jedoch der Hinweis, dass Breadcrumbs als sekundäre Navigation niemals Menüs als primäre Navigation ersetzen können oder sollten. Sie ist immer eine Unterstützung der primären Menü-Navigation.

Wie werden Breadcrumbs grafisch dargestellt?

Die grafische Darstellung von Breadcrumbs auf Webseiten fällt sehr unterschiedlich aus. In der Regel werden sie durch typografische Symbole wie Pfeile oder Schrägstriche voneinander getrennt. Oftmals wird auch ein Button zur Darstellung eines einzelnen Breadcrumbs verwendet.

Grundsätzlich sind die Brotkrumen dezent grafisch gestaltet. Sie sollen weder den eigentlichen Seiteninhalt noch die primäre Menü-Navigation in den Hintergrund rücken. Die Platzierung gehört in den schnell sichtbaren Bereich, damit sich User orientieren können (und Crawler dies honorieren), also “Above the Fold” (ohne zu Scrollen sichtbar). Wichtig ist bei der Verwendung einer Brotkrumen-Navigation, dass diese auf allen Unterseiten einer Website zum Einsatz kommt. Wenn dies nicht der Fall ist, könnten Nutzer verwirrt werden.

Was sind die Vorteile einer Breadcrumb-Navigation?

Breadcrumbs liefern dem Nutzer einer Website eine ganze Reihe von Vorteilen. In erster Linie erleichtern sie dem User die Orientierung auf der Seite. Zudem erlauben sie eine schnellere Navigation innerhalb einer Website durch die Information des Navigationspfades. Mithilfe eines Breadcrumbs kann sich ein Nutzer mit einem Klick auf die Startseite, eine Kategorie- oder Meta-Ebene bewegen. Eine zusätzliche Ausgabe der Zeile als Rich Snippets ermöglicht eine Darstellung in den Suchergebnissen. Vorzugsweise ist der JSON LD Standard anzuwenden.

Neben der besseren Orientierung und der schnelleren Navigation, die vor allem für Webseiten-Nutzer wichtig sind, hat der Breadcrumb-Trail auch zwei wesentliche Bedeutungen für Website-Betreiber. Zum einen erhöht sie die Verweildauer der Nutzer auf der Seite, da ein Nutzer dazu animiert, sich andere Unterseiten anzusehen. Und zum anderen verringert Brotkrumen die Bounce Rate, also den Prozentsatz der Nutzer, die eine Seite verlassen.

Jetzt Kontakt aufnehmen und eine Brotkrümelnavigation vom SEO Doktor ergänzen lassen.