Breadcrumbs-Navigation🍞

Artikel aktualisiert am 25.05.2023

BrotkrĂŒmel wie im MĂ€rchen

Breadcrumbs wird mit BrotkrĂŒmel ins deutsche ĂŒbersetzt. Was hat es mit dem Thema auf sich und was hat es mit Webdesign zu tun? Der Beitrag passt sehr gut in die nordhessische Region. Wie wahrscheinlich viele wissen, sind hier die BrĂŒder Grimm groß geworden und haben ihre vielen weltweit bekannten MĂ€rchen hier geschrieben und erfunden. Dieser Beitrag soll kein MĂ€rchen werden, aber viele kennen das MĂ€rchen von HĂ€nsel und Gretel mit dem Verirren im Wald. Sie haben sich zur Orientierung BrotkrĂŒmel als Weg-Markierung gestreut und daher kommt der Name fĂŒr Breadcrumbs-Navigation.

Wie funktionieren Breadcrumbs einer Website?

Was genau sind Breadcrumbs? Es handelt sich um einen Pfad auf der Website. Damit ist es auf einen Blick möglich zu sehen, wo Nutzerinnen und Nutzer sich derzeit auf der Website befinden. Außerdem sind die angegebenen Seiten verlinkt, damit fokussierbar und dienen zur direkten Bewegung von der aktuellen zu einer anderen Seite auf der Website. Das hat viele Vorteile und einen großen Nutzen fĂŒr Personen, die mit einem Screenreader auf Websites unterwegs sind. Eine genaue Angabe von Eigenschaften finden Sie auf der Website schema.org unter dem Link Breadcrumbs-Liste!

Dieses Element ist aus der Mode gekommen. An dieser Stelle der Aufruf an alle Designerinnen und Designer die das beeinflussen können. Lasst die Breadcrumbs nicht weg, sondern baut sie ein. Es hat verschiedene positive Funktionen wie gerade schon gesagt. Die Möglichkeit zur Orientierung ist eine Funktion die sich positiv auf die Usability also auf die Bedienungs-Freundlichkeit und auch auf die Accessibility also die Barrierefreiheit der Website auswirkt.

Die Auswirkungen auf SEO (Search Engine Optimization)

Das Zweite ist das Thema Suchmaschinen-Optimierung. Viele Elemente und Funktionen zur Verbesserung der Barrierefreiheit und leichten ZugÀnglichkeit beim Webdesign und bei der Programmierung , haben nebenbei auch noch einen positiven Effekt im Bereich der Suchmaschinen-Optimierung.

Der Google Bot oder ein Bot einer anderen Suchmaschine, der zu verschiedenen Zeiten und Algorithmen eine Website „durchcrawlt“, orientiert sich auch bei dem Bewegen auf einer Website an verschiedenen Navigations-Elementen und auch an der Breadcrumbs-Navigation. Damit funktioniert es besser fĂŒr den Bot, die Sinnhaftigkeit der Website und die Struktur (Semantik) zu verstehen. Die Pfade wo genau ich mich befinde hilft auch diesem System eine Website zu verstehen und gut durchcrawlen zu können und alle Punkte im UntermenĂŒ zu finden.

Die richtige Stelle auf der Website

Im Idealfall sollte der Navigations-Pfad im Bereich des Headers, also im oberen Bereich der Webseite zu finden sein. Das ist auch der Weg, den ich bei dem „Betreten“ der Website als zweiten Punkt nach dem HauptmenĂŒ erreiche, wenn ich von oben nach unten durch die Seite hindurch navigiere. Das bedeutet das ist auch schnell fĂŒr Personen erreichbar, die sich an diesen Orientierungs-Punkten entlang bewegen möchten. Damit kann ein schnellerer Weg auf die gewĂŒnschte Seite oder den gewĂŒnschten Beitrag in einem Blog gefunden werden.

Worauf ist bei der Erstellung zu achten?

Worauf sollte bei der Erstellung geachtet werden? GrundsĂ€tzlich wieder auf den Kontrast also auf die Schriftfarbe und den Hintergrund, um dort eine möglichst gute Lesbarkeit zu ermöglichen. Außerdem spielt auch eine barrierearme oder barrierefreie Schriftart eine wichtige Rolle, die eine gute Lesbarkeit ermöglicht und das ist eigentlich schon alles.

Man kann natĂŒrlich verschiedene Strukturen umsetzen und es muss eine Logik dahinter stecken. Wenn es um sehr versteckte UntermenĂŒ-Punkte geht, ist es nicht in fĂŒnf Minuten fertig. Es sind schon einige Gedanken notwendig, aber auch das ist ein Element, was bei einem Website-Projekt einen Mehrwert bietet und fĂŒr mehrere Dinge absolut positiv ist. Dieser Beitrag ist in Form eines Videos auch auf unserem YouTube Kanal erschienen.

Breadcrumbs WordPress Plugin NavXT
Google Developers Structured Data
BrotkrĂŒmel-Navigation auf Wikipedia

Kommentare von BeitrÀgen

Das Kommentieren in diesem Blog ist gewĂŒnscht und möglich!
Bitte senden Sie das Kontakt-Formular ein. Schreiben Sie eine Nachricht, dass Sie ein Benutzerkonto haben möchten. Dann erhalten Sie schnellstmöglich eine Antwort. Vielen Dank fĂŒr das VerstĂ€ndnis!

Schreibe einen Kommentar