Standards · WCAG 2.2

SC 3.2.3 Stufe AA WCAG 2.0

Konsistente Navigation

Navigationsmechanismen, die seitenübergreifend wiederholt auftreten — Hauptnavigation, Fußzeile, Breadcrumbs, Suche — müssen auf jeder Seite, auf der sie erscheinen, in derselben relativen Reihenfolge angezeigt werden. Nutzende, die sich auf Muskelgedächtnis verlassen, sollten das Layout nicht neu erarbeiten müssen.

Was gefordert wird

Wenn derselbe Navigationsmechanismus auf mehreren Seiten einer Website erscheint, muss er jedes Mal in derselben relativen Reihenfolge angezeigt werden. Die visuelle Position ist weniger entscheidend als die Quellcode-Reihenfolge — lautet die Reihenfolge auf einer Seite „Start, Produkte, Preise, Kontakt“, muss sie auf jeder anderen Seite mit dieser Navigation identisch sein.

Nutzende dürfen die Reihenfolge selbst ändern (etwa beim Umordnen eines anpassbaren Dashboards); die Regel gilt für die Navigation, die die Website selbst bereitstellt.

So wird die Anforderung erfüllt

  • Die Hauptnavigation aus einer einzigen Komponente oder einem einzigen Template ableiten — niemals pro Seite manuell kodieren.
  • Die Reihenfolge in der Fußzeile seitenübergreifend einheitlich halten.
  • Breadcrumbs an derselben Position (in der Regel direkt unterhalb des Headers) auf jeder Seite platzieren, auf der sie erscheinen.
  • Sucheingaben an derselben Stelle im Header oder in der Seitenleiste halten.
  • Bei mehrstufigen Abläufen Schrittanzeigen durchgängig an derselben Position verwenden.

Häufige Fehler

  • Eine Hauptnavigation, die auf den Marketing-Seiten anders angeordnet ist als auf den Anwendungsseiten, weil zwei verschiedene Teams die Templates verantworten.
  • Breadcrumbs, die auf manchen Seiten oberhalb der H1 und auf anderen unterhalb erscheinen.
  • Ein „Hilfe“-Link, der auf den meisten Seiten im Header und auf der Checkout-Seite in der Fußzeile steht.
  • Eine Sucheingabe, die auf den meisten Seiten oben rechts und im Blog in der Seitenleiste platziert ist.

Warum es wichtig ist

Screenreader-Nutzende erstellen sich schnell eine mentale Karte der Seitenstruktur. Sehende Tastaturnutzende navigieren durch Landmarks per Tab. Menschen mit kognitiven Behinderungen verlassen sich auf konsistente Positionierungen zur Orientierung. Wenn die Navigation sich zwischen Seiten ändert, müssen alle Nutzenden erneut lernen — doch Nutzende assistiver Technologien tragen dabei die höchsten Kosten, weil sie die gesamte Seite nicht auf einen Blick überblicken können, um das neue Layout zu erfassen.

Dieses Erfolgskriterium ist eines der am einfachsten zu erfüllenden, wenn die Website auf einem gemeinsamen Template-System aufbaut — und eines der schmerzhaftesten, wenn Jahre von Legacy-Templates nachgerüstet werden müssen.