»Breadcrumb«

Nico Held10. März 2025

Wer tief in einer Website unterwegs ist – etwa in einem Shop unter Kategorie, Unterkategorie und Produkt – verliert schnell die Orientierung. Wo bin ich? Wie komme ich eine Ebene zurück? Die Breadcrumb-Navigation beantwortet das: eine Zeile mit verlinkten Ebenen, z. B. Startseite > Leistungen > Webdesign > Projekte. Sie zeigt den Pfad und erlaubt mit einem Klick den Sprung zurück in übergeordnete Bereiche.

Breadcrumbs verbessern die Nutzerführung und die Usability. Statt mühsam über die Hauptnavigation zu suchen, sieht der Nutzer auf einen Blick, in welcher Hierarchie er sich befindet, und kann gezielt zurückgehen. Das reduziert Klicks und Frustration, besonders bei umfangreichen Sites mit vielen Ebenen. Für Suchmaschinen sind Breadcrumbs ein klares Struktursignal: Sie helfen, die Einordnung einer Seite zu verstehen und können als erweiterte Snippets in den Suchergebnissen erscheinen.

Technisch werden Breadcrumbs oft als Liste mit Trennzeichen (Pfeil, Schrägstrich) dargestellt; die letzte Ebene, die aktuelle Seite, ist in der Regel nicht verlinkt. Für Barrierefreiheit und SEO wird die Breadcrumb als nav-Element mit aria-label „Breadcrumb“ ausgezeichnet; bei strukturierten Daten (Schema.org BreadcrumbList) können Suchmaschinen die Hierarchie noch besser auswerten.

Breadcrumbs sind kein Ersatz für die Hauptnavigation, sondern eine Ergänzung. Sie eignen sich besonders für Shops, Wikis, Portale und alle Sites mit klarer Hierarchie. Wo die Struktur flach ist oder nur wenige Ebenen existieren, können Breadcrumbs entfallen. Wo sie sinnvoll sind, sollten sie konsistent und gut sichtbar – meist oberhalb des Hauptinhalts – platziert werden.

Eine klare Breadcrumb-Navigation zeigt Nutzern und Suchmaschinen: Diese Seite ist kein loses Blatt, sondern Teil eines durchdachten Gefüges. So wird Orientierung zur Selbstverständlichkeit.

Das könnte dich auch interessieren

»Design System«
Webdesign

Design System

»Core Web Vitals«
Webdesign

Core Web Vitals