Was ist Breadcrumb auf einer Website?
Wir sprechen hier nicht von den Brotkrümeln, mit denen Fischstäbchen oder Walnüsse belegt werden. Breadcrumbs werden in der WordPress-Entwicklung verwendet, um die Navigation über das primäre Navigationsmenü hinaus zu erleichtern. Es handelt sich dabei um eine Liste von Komponenten in Form von Links, die durch ein Zeichen oder ein Bild getrennt sind, und ist typischerweise auf Websites mit mehreren Seiten zu sehen. Wenn eine Website also eine hohe Absprungrate oder einen hohen Prozentsatz an abgebrochenen Warenkörben aufweist, ist dies in der Regel das Ergebnis einer verwirrenden Primärnavigation oder einer verlorenen Breadcrumb-Navigation (Sekundärnavigation).
Die Brotkrümelnavigation ist in der Regel weniger auffällig als die anderen numerischen Elemente, die sie umgeben, aber sie scheint immer zwischen dem Hauptmenü und dem Inhalt angeordnet zu sein. Brotkrümel zeigen dem Besucher, wo er sich gerade auf einer Website befindet.
Da die Komponente, die den äußersten linken Flügel eines Breadcrumb-Trails bildet, die größte Klassenseite oder die Startseite ist, kann ein Website-Besucher seine Reise immer wieder zurückverfolgen und neu beginnen, um die Auffindbarkeit der Daten zu verbessern. Wenn Ihre Website mehrere Kategorien oder eine große Anzahl interner Seiten hat, sollten Sie die Verwendung einer Breadcrumb-Trail-Navigation in Betracht ziehen. Beginnen wir also mit dem Hauptthema der Diskussion.
Obwohl der Zweck aller Breadcrumbs im Webdesign darin besteht, die Auffindbarkeit der Website zu verbessern, gibt es vier Arten von Breadcrumbs, die derzeit verwendet werden. Eine von ihnen wird häufiger verwendet als die anderen, und die folgende Liste ist in absteigender Reihenfolge der Verwendung von Breadcrumb-Navigation durch Websites.
Arten der Brotkrümelnavigation
1. Attribut Breadcrumb-Navigation
Ein attributbasierter Breadcrumb ist ein Breadcrumb-Typ, der Attribute verwendet, um den Pfad des Breadcrumbs zu bestimmen. Dies steht im Gegensatz zur Verwendung eines statischen Pfades oder einer URL. Bei der Verwendung eines attributbasierten Breadcrumbs wird der Pfad des Breadcrumbs durch die Attribute des angezeigten Objekts bestimmt. Wenn Sie z. B. eine Produktseite anzeigen, verwendet der Breadcrumb die Attribute des Produkts, um den Pfad zu bestimmen. Das bedeutet, dass der Breadcrumb für jedes Produkt anders aussieht. Attributbasierte Breadcrumbs können sehr hilfreich sein, wenn es darum geht, den Nutzern eine kontextbezogene und relevante Erfahrung zu bieten. Sie können jedoch auch schwierig einzurichten und zu verwalten sein. Wenn Sie die Verwendung von attributbasierten Breadcrumbs in Betracht ziehen, sollten Sie die Vor- und Nachteile sorgfältig abwägen, bevor Sie eine Entscheidung treffen.
Sie zeigen auf jeder Seite Metainformationen an, geben aber nicht Ihre Position auf der Website an. Bei dieser Art der Breadcrumb-Navigation müssen Sie Ihre Schritte durch die Navigation der Website nicht zurückverfolgen. cars.com beispielsweise verwendet die einzigartige Breadcrumb-Navigation, die die Attribute jeder Seite aus dem Breadcrumb-Pfad liefert.
Versuchen Sie, eine Route auf der Website auszuwählen, und Sie werden feststellen, dass der Brotkrümelpfad ab einem bestimmten Punkt nicht mehr den Ausgangspunkt, sondern die Eigenschaften jeder Seite anzeigt. Einige Websites, wie z. B. Overstock, verwenden eine Breadcrumb-Navigation mit Filteroptionen für die Benutzer. Die Charakternavigation kann Schlüsselwörter enthalten, um SEO-Vorteile auf der Website zu erzielen, aber da sie nicht Ihren Standort auf der Website anzeigt, so dass Sie Ihre Browsing-Route zurückverfolgen können, kann sie zu Problemen mit der Benutzerfreundlichkeit führen.
Ein weiteres Problem verschiedener Breadcrumbs ist, dass dieselbe Webseite sowohl in einer Breadcrumb-Navigation als auch in einer kategoriebasierten Navigation erscheinen kann, was zu doppeltem Material führt. Diese Art der Breadcrumb-Navigation wird gelegentlich auf E-Commerce-Websites beobachtet.
2. Breadcrumb-Navigation mit Standort
Die Breadcrumb-Navigation zeigt, wie der Name schon sagt, Ihren Standort auf einer bestimmten Website an. Diese Form der Navigation wird am häufigsten auf Websites verwendet und kann eine einfache Struktur haben. Sie zeigt die Inhaltshierarchie einer Website an und ermöglicht es den Benutzern, mit einem einzigen Klick zu einer übergeordneten Klassenseite zurückzukehren.
Diese Form der Breadcrumb-Navigation wird häufig bei Websites mit hierarchischen Strukturen und methodisch organisierten Klassen verwendet. Die Breadcrumb-Navigation der Website ist inaktiv und bleibt daher in jedem Fall konsistent. Das beste Beispiel hierfür ist unser WordPress-Wartungsservice. Scrollen Sie auf dieser Seite nach unten zu „Standorte“ und Sie werden alles in Aktion sehen.
3. Stich-Breadcrumb-Navigation
Die Pfad-Breadcrumb-Navigation zeigt den Pfad an, über den eine bestimmte Seite erreicht wird. Da bestimmte Webseiten über verschiedene Wege erreichbar sind, führt dies zu unnötigen Komplikationen mit doppeltem Material. Diese Art von Breadcrumb wird auf der Grundlage des Pfades generiert, der zum Erreichen einer bestimmten Seite verwendet wurde. Wenn ein Nutzer über eine Suchmaschine im Internet direkt auf eine interne Website gelangt, führt der vorgeschlagene Pfad möglicherweise nicht zur gewünschten Zielseite. Dies ist ein gutes Beispiel für WooCommerce-Websites:
- Startseite > Karosserietyp > Marke > Modell > Generation > Preis von / bis > Baujahr > Kraftstoff > Anzahl KM/Meilen
- Startseite > Garten & Natur > Hinterhof > Lebensraum > Lebensräume für Bienen und Schmetterlinge
- Startseite > Männer > Herrenduft > Alle Männer einkaufen > Eau De Toilette für ihn
4. Titel-Breadcrumb-Navigation
Diese einst verwendete Breadcrumb-Navigationsmethode ist eine der merkwürdigsten und wird auf der Website nicht mehr verwendet. Diese Breadcrumb-Navigation ist im Titel-Tag der Website zu sehen. Diese Art der Breadcrumb-Navigation wurde wahrscheinlich eingeführt, um die SEO der Website zu verbessern; sie hat jedoch keinen Nutzen für die Benutzerfreundlichkeit und wurde daher zurückgezogen. Dies sind die vier Arten der Breadcrumb-Navigation, die Sie verstehen müssen. Lassen Sie uns nun untersuchen, warum die Breadcrumb-Navigation für Ihre Website so wichtig ist.
Vorteile der Breadcrumb-Navigation

Hier sind die wichtigsten Vorteile der Breadcrumb-Navigation
1. SEO:
Da eine Website den Suchmaschinen viel über den Aufbau Ihrer Website verrät, hilft ein Breadcrumb-Trail bei der Ausarbeitung einer ähnlichen Funktion. Mit Hilfe eines Breadcrumb-Trails wird die Bedeutung des Inhalts Ihrer Website deutlicher. Suchmaschinen wie Google erkennen diese sekundären Navigationspfade und liefern in ihren Suchergebnissen genaue und bessere Informationen über Ihre Webseiten. Außerdem können die in einem Breadcrumb-Trail verwendeten Wörter zu den Schlüsselwörtern Ihrer Website werden. Die inneren Hyperlinks der Breadcrumb-Navigationspfade liefern den Suchmaschinen weitere Informationen über diese Seite und die Webseite, auf die sie verweisen.
Darüber hinaus hat Google damit begonnen, Breadcrumbs in seinen eigenen Suchergebnissen anzuzeigen, und auch wenn es diese Funktion für Websites, die keine Breadcrumbs haben, nicht durchführen kann, sollte der Erwerb einer Breadcrumb-Navigation der Suchmaschine helfen, Breadcrumbs bei der Suche anzuzeigen. Bitte beachten Sie: Breadcrumbs werden in den Suchergebnissen von Google nur für eine Auswahl von Suchbegriffen angezeigt.
2. Erhöhen Sie die Zeit vor Ort:
Nehmen wir an, ein Nutzer gibt einen Suchauftrag ein, um einen weißen elektrischen Kerzenwärmer zu kaufen, und kann über ein Suchergebnis auf die Warenseite Ihrer Website geleitet werden. Der Nutzer kann in der Breadcrumb-Navigation auf den Link Elektrische Kerzenwärmer klicken, um verschiedene Optionen aus der Gruppe zu testen. Dadurch wird die Absprungrate auf Ihrer Website erheblich reduziert. Werfen Sie einen Blick auf einige Screenshots unten. In der Google-Suche wurde eine Suche nach einem weißen elektrischen Kerzenwärmer eingerichtet. Beide Produktseiten sind in den Suchergebnissen enthalten.
Wenn der Kunde also mit den Informationen auf der Webseite nicht zufrieden ist, kann er die Webseite gleichzeitig verlassen. Das zweite Ergebnis erfordert jedoch, dass wir mit Hilfe einer festgelegten Breadcrumb-Navigation zu einer bestimmten Seite gehen. Dies kann dazu führen, dass Kunden weiter in größere Komponenten der Breadcrumb-Navigation navigieren, in diesem Szenario sogar zu elektrischen Kerzenwärmern, um eine breitere Auswahl zu finden und mit ihrer eigenen ersten Option zu vergleichen.
3. Geringer Platzbedarf:
Durch ihre unauffällige Schriftgröße nehmen sie den geringsten Platz auf einer Seite ein. Sie führen nicht zu zusätzlichen Problemen mit der Ladezeit der Webseite. Dies sind die vier Hauptvorteile einer Breadcrumb-Navigation auf Ihrer Website. Da es fast keine Nachteile gibt, scheint es eine wirklich einfache Entscheidung zu sein, eine Website zu erstellen, die eine Breadcrumb-Navigation beinhaltet.
4. Benutzerfreundlichkeit:
Die Benutzerfreundlichkeit ist fast der wichtigste Vorteil einer Breadcrumb-Navigation auf Ihrer Website. Manche Leute mögen die Brotkrümelnavigation übersehen, doch wer sie nutzen will, hat keine Probleme, die vielen Seiten der Website zu durchforsten, um die gewünschten Informationen oder Elemente zu finden. Die Brotkrümelnavigation verbessert die Auffindbarkeit, so dass die Nutzer ihre Arbeit schneller erledigen können.
Im Folgenden werden einige der besten Methoden aufgeführt
Bewährte Verfahren für die Breadcrumb-Navigation:
1. Beginnen Sie mit der Website
Dies ist eine der Konventionen, wenn es um die Platzierung der Breadcrumb-Navigation geht. Beginnen Sie Ihren Breadcrumb-Trail immer mit allen Websites und enden Sie mit der aktuellen Seite. Einige Websites, darunter Zara, umgehen die Eigenschaftsseite und beginnen den Krümelpfad mit einer höherwertigen Seite. Ähnlich ist die Situation bei Target.com. Dies kann dazu führen, dass ein Besucher nach anderen Optionen sucht, um nach Hause zurückzukehren, was auf eine schlechte Benutzerfreundlichkeit zurückzuführen sein kann.
Zeichenbasierte Breadcrumbs beginnen in der Regel nicht mit der Webseite, und wenn Sie sich für eine entschieden haben, stellen Sie sicher, dass dem Kunden eine auffällige Methode gezeigt wird, um zur Webseite zurückzukehren. Wenn Sie an einer WordPress-Website arbeiten, dann bieten benutzerdefinierte WordPress-Entwicklungsdienste einige Anpassungen für die Breadcrumb-Navigation, die Ihnen die Arbeit erleichtern.
2. Erstellen Sie eine Sitemap
Wenn Ihre Website keine Sitemap besitzt, erstellen Sie eine visuelle, wie einen Baum. Dies gibt Ihnen eine gute Idee, um Ihre eigene Breadcrumb-Navigation auf Ihrer Website zu koordinieren. Wenn Sie feststellen, dass fast alle reduzierten Seiten auf der Website mehrere Klassen enthalten, können Sie die Breadcrumb-Navigation umgehen. Umgekehrt können Sie versuchen, die Website so zu gestalten, dass jede Seite ihren eigenen Pfad hat, was die Implementierung der (meist verwendeten) Breadcrumb-Navigation erleichtert.
3. Entfernen Sie unnötige Elemente
Einige Websites führen unnötige Komponenten auf, die die Breadcrumb-Navigation beschreiben oder dieser übermäßige Leistung verleihen. Die Benutzer könnten denken, dass es sich um einen Hyperlink handelt und ihre Zeit damit verschwenden, darauf zu klicken. Herkömmlicherweise sind alle Komponenten eines Breadcrumb-Trails Links, und solche Missverständnisse sind vorprogrammiert. Außerdem bieten einige Websites neben den Breadcrumb-Links auch Auswahlmöglichkeiten für Bereiche an.
Dies kann ebenfalls zu Verwirrung bei den Kunden Ihrer Website führen, da sie nicht wissen, auf welche Seite der Backlink sie führen würde. Die Breadcrumb-Komponenten sind es möglicherweise nicht. Dies kann ein unnötiger Zusatz für einen Zweck sein, der derzeit in den meisten Browsern, an die die Benutzer normalerweise gewöhnt sind, vorhanden ist. Es schadet nicht, diese Komponenten zu haben; sie sind sicherlich nicht die Ursache für eine höhere Absprungrate. Aber es ist gut, etwas zu verhindern, das den Benutzer dazu bringt, sich über seinen eigenen Zweck zu wundern oder eine Funktion zu replizieren, die bereits in den Browsern vorhanden ist.
4. Immer eine sekundäre Navigation
Die Breadcrumb-Navigation ist die Navigation auf Ihrer Website. Sie ist eine flache Linie aus miteinander verbundenen Elementen. Einige Websites verwenden ein Fly-out-Menü auf einer Breadcrumb-Komponente, und dies ist in der Regel ein Merkmal des Hauptmenüs auf einem traditionellen Website-Layout. Wenn Sie sich nicht an die Gepflogenheiten halten und mit dem Zweck eines Breadcrumb-Menüs experimentieren, kann sich das auf die Stärke Ihrer Website auswirken.
5. Immer oberhalb des Falzes
Dies scheint eine eindeutige Best Practice zu sein, denn praktisch alle Websites haben ihre eigene Breadcrumb-Navigation direkt unter der Hauptnavigation, oberhalb der Trennlinie. Es gibt eine Reihe von Websites, die sie in der Fußzeile platzieren, und es wird empfohlen, dies zu vermeiden. Dies geschieht zum einen aus Gründen der Benutzerfreundlichkeit, zum anderen aber auch aus dem einfachen Grund, dass die Bedienung eines Designs oder Materials eine längere Zeit in Anspruch nimmt, als dies bei den üblichen Konventionen der Fall ist, die man gewohnt ist.
6. Die Schriftgröße muss kleiner sein als die Schriftgröße des Menüs
Achten Sie darauf, dass die Schriftgröße dieser Breadcrumb-Navigationskomponente kleiner ist als die der Hauptnavigation. Es sollte eine klare Unterscheidung zwischen ihnen geben.
7. Keyword-Konsistenz
Da Breadcrumbs eine kleine Rolle bei der Suchmaschinenoptimierung spielen können, sollten Sie darauf achten, dass Sie in den Breadcrumb-Ankertexten dieselben Schlüsselwörter verwenden wie im Seitennamen und in der URL der Seite.
8. Variationen von Zeichensymbolen
Es gibt jedoch eine Vielzahl von Anpassungen, die auf Ihren Breadcrumb-Trail angewendet werden können. Dies sind einige der effektivsten Strategien zur Implementierung der Breadcrumb-Navigation auf Ihrer Website. Denken Sie daran, dass Sie die Brotkrümelnavigation nur dann einsetzen sollten, wenn sie für die Besucher Ihrer Website von Vorteil ist. Wenn Ihre Website zahlreiche Ebenen von Webseiten umfasst und Sie glauben, dass Breadcrumbs Ihren Kunden bei der Navigation auf der Website helfen können, sollten Sie Breadcrumbs verwenden.
Ansonsten können Sie WordPress-Plugins mit Hilfe von WordPress-Entwicklungsdiensten installieren. Es ist an der Zeit, mit den Vorbereitungen für die Entwicklung optimaler Breadcrumb-Navigationspfade zu beginnen. Da die Installation dieser Plugins weder die Ladezeit noch das Layout Ihrer Website beeinträchtigt, ist es nicht schädlich, Ihren Kunden Zugang zu dieser äußerst praktischen sekundären Navigationsplattform zu gewähren. Verfügt Ihre Website über eine Breadcrumb-Navigation? Sagen Sie uns, wie Sie die Breadcrumb-Navigation einsetzen würden, um die Funktionalität einer Website zu verbessern.