Darstellung und Verhalten

Die Breadcrumb-Navigation ist eine horizontal verlaufende Liste der Seitentitel. Jede Ebene wird durch einen Pfeil getrennt. Die aktuelle Seite wird hervorgehoben.

• Die Breadcrumb-Navigation besteht aus:
  • Startseite / Kanton Zürich
  • Hierarchischer Pfad zur aktiven Seite

Responsives Verhalten

• Ist die Breadcrumb länger als die Inhaltsbreite, so wird folgendes angezeigt:
  • Erster Eintrag (= Startseite / Kanton Zürich)
  • «...»
  • aktive Seite
  • Hat es ausreichend Platz, so wird noch die Elternseite der aktiven Seite angezeigt
  • Bei Klick auf «...» wird ein DropDown-Menü mit den nicht sichtbaren Einträgen angezeigt. Die Reihenfolge ist hierarchisch
• Bei sehr kleinen Screens (bspw. Mobile) wird ein Zurück-Link auf die Elternseite anstelle der Breadcrumb angezeigt

Verwendung

Wir setzen Breadcrumbs ein, um den Pfadverlauf darzustellen. Sie dienen der Orientierung der Nutzenden und helfen ihnen, dem Pfad entlang zurück zu navigieren.

Die Breadcrumb-Navigation ist Teil des Seitenkopfs bzw. des Headers bei Applikationen. Sie steht immer am Anfang einer jeden Seite, unterhalb des Headers und vor dem Seitentitel. Sie zeigt den Nutzenden, auf welcher Seite sie sich befinden und ermöglicht es, hierarchisch weiter nach oben zu navigieren.

Auf der Webseite des Kantons ist der erste Eintrag immer «Kanton Zürich». Er ist hervorgehoben und führt auf die Startseite von zh.ch.