Zum Inhalt springen

Stop Wise

Stop Wise

Wie man sich einfach auf einer Website mit einem klaren und detaillierten Plan zurechtfindet

Ein Besucher, der die gesuchten Informationen nicht findet, verlässt die Seite in wenigen Sekunden. Die Navigation auf einer Webseite basiert auf…

Femme étudiant attentivement un plan de site imprimé sur un bureau en bois dans un bureau à domicile moderne et organisé
Lesezeit: 5 Min.

Ein Besucher, der die gesuchte Information nicht findet, verlässt die Seite innerhalb von Sekunden. Die Navigation auf einer Website basiert auf präzisen, messbaren und oft schlecht kalibrierten Mechanismen. Welche strukturellen Elemente unterscheiden eine Website, auf der man sich mühelos orientiert, von einer Website, auf der man sich bereits auf der zweiten Seite verliert?

Zugänglichkeit der Webnavigation: Was die europäische Regulierung 2025 ändert

Die Wettbewerber behandeln die Navigation als reines UX- oder Marketingthema. Seit dem 28. Juni 2025 hat die regulatorische Dimension das Thema eingeholt. Das European Accessibility Act legt den betroffenen digitalen Diensten konkrete Anforderungen auf: Navigation, die mit der Tastatur und einem Screenreader nutzbar ist, nicht nur eine ansprechende visuelle Organisation.

Die Empfehlung WCAG 2.2, die vom W3C im Oktober 2023 veröffentlicht wurde, fügt das Kriterium “Focus Not Obscured” hinzu. Das mit der Tastatur ausgewählte Element darf nicht von einem festen Banner, einem Chatfenster oder einem Werbemodul verdeckt werden. Dieses Kriterium stellt die oft als universelle Lösungen präsentierten Sticky Headers in Frage.

Eine Website-Map www.bertrandbarre.com veranschaulicht die Logik einer vollständig dargestellten Baumstruktur, bei der jeder Link ohne komplexe Interaktion oder bedingtes Hover zugänglich bleibt.

Konkrete gesagt, muss eine Sitemap, die diese Anforderungen erfüllt, drei technische Bedingungen erfüllen:

  • Jeder Link muss über die Tastatur in einer logischen Reihenfolge, die die Hierarchie der Seiten widerspiegelt, erreichbar sein.
  • Der Inhalt der Sitemap darf nicht von einem durch Wischen oder Benutzereingabe ausgelösten Laden abhängen: Google kann einen in einem Akkordeon versteckten Inhalt lesen, wenn er im HTML enthalten ist, aber nicht, wenn er eine komplexe Interaktion erfordert.
  • Kein festes Interface-Element (Cookie-Banner, Chat, Sticky Header) darf den aktiven Link während der Navigation mit der Tastatur überdecken.

Mann erklärt einen Website-Navigationsplan, der auf einem Glasboard in einem modernen Büro gezeichnet ist

Menüstruktur und Sitemap: Vergleichstabelle der Navigationsformate

Das Hauptmenü und die Sitemap (HTML-Sitemap) erfüllen ergänzende Funktionen, aber ihre technischen Merkmale unterscheiden sich. Die folgende Tabelle vergleicht die beiden Formate anhand der Kriterien, die für den Benutzer und für die Suchmaschinenoptimierung wichtig sind.

Kriterium Hauptmenü (Navigationsleiste) HTML-Sitemap (dedizierte Seite)
Anzahl sichtbarer Links Begrenzt (5 bis 10 empfohlene Einträge) Unbegrenzt, zeigt die gesamte Baumstruktur
Erreichbare Tiefe Untermenüs mit maximal 2-3 Ebenen Alle Ebenen, einschließlich tiefer Seiten
Tastaturzugänglichkeit Hängt vom Code ab: Untermenüs beim Hover können problematisch sein Liste von nativen HTML-Links, über Tabulator navigierbar
Nützlichkeit für die Suchmaschinenoptimierung Überträgt Linkgewicht auf die Hauptseiten Ermöglicht die Indizierung von verwaisten oder tiefen Seiten
Mobile Verhalten Wird oft in ein Hamburger-Menü reduziert, Hierarchie manchmal gekürzt Bleibt vollständig, wenn die Seite responsiv ist

Der signifikanteste Unterschied betrifft die Tiefe. Ein gut gestaltetes Navigationsmenü deckt die Hauptkategorien ab. Im Gegensatz dazu stellt eine Sitemap die Seiten dar, die im Menü niemals angezeigt werden: alte Artikel, versteckte Produktblätter, Seiten von Nebenkategorien.

Wenn das Hamburger-Menü die Struktur verdeckt

Auf Mobilgeräten reduzieren die meisten Websites ihre Navigation hinter einem Hamburger-Icon. Der Inhalt des Menüs bleibt oft identisch mit der Desktop-Version. Das Problem tritt auf, wenn die Hierarchie abgeflacht ist: Alle Rubriken erscheinen auf derselben Ebene, ohne visuelle Unterscheidung zwischen einer übergeordneten Kategorie und einer Unterseite.

Eine Sitemap behält ihre vollständige Hierarchie auf Mobilgeräten, weil sie auf verschachtelten HTML-Listen basiert, nicht auf einer komplexen JavaScript-Komponente. Der Benutzer, der im Hamburger-Menü verloren ist, kann sich immer auf diese Seite zurückziehen, um die Gesamtstruktur wiederzufinden.

Interne Links und Informationsarchitektur: Was die Navigation tatsächlich misst

Die Navigation beschränkt sich nicht auf das Menü oben auf der Seite. Jeder interne Link im Inhalt, jeder Breadcrumb, jeder kontextuelle Verweis trägt zur Navigationsstruktur bei. Was eine leicht durchsuchbare Website von einer verwirrenden unterscheidet, ist die Kohärenz zwischen diesen verschiedenen Ebenen.

Junge Frau, die auf einem strukturierten Sitemap auf ihrem Laptop in einem gemütlichen Wohnzimmer navigiert

Drei konkrete Signale ermöglichen die Bewertung der Qualität dieser Architektur:

  • Die Klicktiefe: die Anzahl der Klicks, die erforderlich sind, um von der Startseite zu einer beliebigen Seite zu gelangen. Über drei Klicks hinaus besteht die Gefahr, dass die Seite von den Nutzern ignoriert und von den Suchmaschinen unterindexiert wird.
  • Die Kohärenz der Bezeichnungen: Ein Link mit dem Titel “Unsere Dienstleistungen” im Menü, “Was wir tun” im Footer und “Leistungen” im Breadcrumb schafft unnötige kognitive Belastung. Ein stabiler Wortschatz in der gesamten Navigation reduziert die Orientierungszeit.
  • Das kontextuelle Verlinken: Links, die im Text eines Artikels, in der Nähe des behandelten Themas platziert sind, senden ein stärkeres Relevanzsignal als ein generischer Link in einem Seitenmenü.

Breadcrumb und Positionsmarker

Der Breadcrumb erfüllt eine unterschätzte Funktion: Er zeigt dem Benutzer, wo er sich in der Baumstruktur befindet, ohne dass er zum Menü zurückkehren muss. Auf Websites mit mehreren Dutzend Kategorien reduziert der Breadcrumb die Notwendigkeit, die Zurück-Taste des Browsers zu verwenden.

Für Suchmaschinen strukturiert der Breadcrumb die Daten in Form eines hierarchischen Pfades. Seiten, die über einen Breadcrumb verfügen, zeigen diesen Pfad direkt in den Suchergebnissen an, was die Lesbarkeit des angezeigten Snippets verbessert.

Mobile Navigation und Indizierung: Für das dominante Format entwerfen

Mobile-First-Indexierung bedeutet, dass Google die mobile Version einer Website vorrangig analysiert. Ein Navigationsplan muss die gleiche Hierarchie auf Mobilgeräten und Desktop beibehalten. Das Entfernen von Rubriken aus dem mobilen Menü, um Platz zu sparen, macht sie unsichtbar für die Indizierung.

Die häufigste Falle betrifft Mega-Menüs, die auf kleinen Bildschirmen in Akkordeons umgewandelt werden. Wenn der Inhalt dieser Akkordeons dynamisch nach einer Interaktion geladen wird, können bestimmte Seiten von den Crawling-Robotern möglicherweise nie entdeckt werden. Im Gegensatz dazu bleibt ein im HTML vorhandener und einfach visuell versteckter Inhalt lesbar.

Der technische Unterschied ist klar: Ein CSS-Akkordeon, das vorhandenes HTML verbirgt, stellt kein Problem für die Indizierung dar. Ein JavaScript-Akkordeon, das den Inhalt auf Anfrage lädt, kann Lücken in der durchsuchten Baumstruktur schaffen.

Die Navigation einer Website wird an ihrer Fähigkeit gemessen, jede Seite in wenigen Klicks, auf allen Bildschirmformaten, für alle Benutzergruppen auffindbar zu machen. Ein detaillierter Sitemap bleibt das zuverlässigste Sicherheitsnetz, wenn das Hauptmenü seine strukturellen Grenzen erreicht.

Wie man sich einfach auf einer Website mit einem klaren und detaillierten Plan zurechtfindet