Die Website-Navigation zeigt deinen Usern, wo es lang geht! Niemand sollte sich auf deiner Seite verirren. Die Navigation gehört daher zu den wichtigsten Elementen deiner Website. Sie ist idealerweise intuitiv zu bedienen und benutzerfreundlich – sowohl auf dem Desktop als auch auf Mobilgeräten. Mit der richtigen Gestaltung der Navigation, ebnest du die Wege der User und beeinflusst somit das Nutzerverhalten. Datenanalysen zeigen: Eine perfekte Website-Navigation wirkt sich deutlich auf die Conversion Rate aus. Doch wohin platzierst du die Website-Navigation, welche Reihenfolge und welches Design ist das richtige? Auf die zentrale Frage „Wie sollte die Navigation auf einer Website aussehen?“ geben wir nützliche Antworten: Wir präsentieren dir wichtige Tipps für den idealen Aufbau und die Analyse der Navigation (Website) sowie zum Website-Navigation-Design.
Was ist die Navigation auf einer Website?
Die Navigation ist eine wichtige und zentrale Website-Komponente. Weitere Bezeichnungen sind unter anderem Website Navigation Bar oder Navigationsleiste. Generell ist die Website-Navigation eine Sammlung und Anordnung von Links zu verschiedenen Bereichen eines Online-Angebots. So kann ein Online-Shop beispielsweise eine Navigation zu verschiedenen Produktkategorien zeigen. Die Navigation besteht in der Regel aus Menü, Untermenü oder Menügruppe. Meist gibt es mehrere Navigationen innerhalb einer Website – so kommt zum Hauptmenü beispielsweise noch das Footer-Menü. Eine schwache Website-Navigation kann zu einer ungewollt hohen Bounce Rate führen. Dies zeigt unter anderem eine Befragung der Marketingfirma KoMarketing, bei der 37 Prozent der Befragten angaben, dass eine schlechte Navigation Grund genug sei, die Website zu verlassen. Bei einer Umfrage von Contentsquare und CommerceNEXT unter Online-Einkäufern gaben 38 Prozent an, dass bei einer verständlichen Website-Navigation die Bereitschaft zu künftigen Käufen steige.
Dabei sollten die Begriffe in der Navigation genau auf deine Website zugeschnitten sein. Mit austauschbaren Begriffen wie „Dienstleistungen“ oder „Ressourcen“ können User wenig anfangen, sind verwirrt und die User Experience leidet. Branchenjargon und allzu kreative Begriffe solltest du allerdings auch vermeiden. Allerdings dürfen die Begriffe wiederum nicht allzu verspielt rätselhaft sein, denn dies erschwert es den Usern unnötig. Es kommt also auf die Balance zwischen etablierten und individuellen Ausdrücken an.
Eine ideale Website-Navigation führt nicht nur die User optimal durch dein Online-Angebot; die Navigation spielt auch eine wichtige Rolle für SEO. Denn hier kommen verschiedene google-relevante Aspekte zusammen: Keywords und interne Verlinkungen. Die Website-Navigation ist ein wichtiges Signal für Google, um Inhalt, Relevanz und Zusammenhang zu beurteilen, wie John Mueller in einem Google-Hangout erläutert.
Hier findest du Guidelines, Best Practices und Beispiele zur Optimierung und Gestaltung der wichtigsten Seitenbereiche von Homepage, über PDP und PLP bis zur Navigation.
Hier findest du Guidelines, Best Practices und Beispiele zur Optimierung und Gestaltung der wichtigsten Seitenbereiche von Homepage, über PDP und PLP bis zur Navigation.
Welche Navigationskonzepte gibt es?
Es gibt zahlreiche Gestaltungsmöglichkeiten der Navigationsleiste. Website und Navigation sollten harmonisch zusammenpassen. Eine kleine Seite braucht etwa keine umfangreichen Mega- und Untermenüs. Einige Styles haben sich im Bereich Website-Navigation-Design etabliert. Auch das Endgerät ist entscheidend für die Wahl der Navigation (Website). Beispiele:
Hamburger-Menü: Hierbei handelt es sich um drei gestapelte Linien, die an einen Burger erinnern – ein platzsparendes Menü, das besonders im mobilen Bereich beliebt ist.
Mega-Menü: Das Mega-Menü ist ein umfangreiches Dropdown-Menü mit mehreren Spalten und Zeilen, das besonders bei komplexen Websiten zum Einsatz kommt.
Horizontales Menü: Die obere Navigationsleiste (Top Bar Navigation) zeigt die Hauptbereiche deiner Website an, während die untere Navigationsleiste zusätzliche sekundäre Links zu Kategorieseiten, FAQs, Kontaktinformationen und Ähnlichem anzeigt.
Vertikales Menü (Sidebar Navigation): Die Menüpunkte werden vertikal untereinander gezeigt.
Off-Canvas: Diese Navigationsleiste ist versteckt und wird erst durch eine Interaktion sichtbar – etwa durch hovern mit der Maus.
Die Breadcrumb-Navigation informiert die Nutzer, wo sie sich gerade befinden. Sie können etwa schnell und unkompliziert zur Kategorieseite zurück navigieren.
Wie sollte die Navigation auf einer Website aussehen?
Durch einen geschickten Aufbau der Navigation auf deiner Website, kannst du die Bounce Rate enorm reduzieren. Mit folgenden Tipps zur Website-Navigation, lotst du deine Nutzer perfekt zum Ziel.
So optimierst du die Navigationsstruktur
Die wichtigsten Kategorien und Elemente wie die Suche oder der Warenkorb sollten immer sichtbar und verfügbar sein (Gilt nicht für den Check-out).
Achte darauf, dass sich die Navigationsleiste klar von deiner Website abhebt.
Verwende einen kräftigen, kontraststarken Hintergrund. Auch dann, wenn sich Unterkategorien öffnen / ausklappen.
Die Navigation sollte zu jedem Zeitpunkt sichtbar und vor allem einfach erreichbar sein („sticky“).
Zeige die stärksten Kategorien in der Reihenfolge ihrer Performance und in der standardmäßigen Leserichtung der jeweiligen Region an.
Vermeide Branchenjargon. Verwende Begriffe, die deinen Nutzern vertraut sind, leicht erfasst werden können und auf keinen Fall intern verwendete Bezeichnungen.
Stelle sicher, dass sich Menüs öffnen, wenn User darüber hovern.
Nutze Bilder für Kategorien für mehr Klarheit und schnelles, einfaches Verständnis, was sich hinter der Kategorie verbirgt.
Navigiere dich jetzt zu den Conversion Snacks ins Webinar „Die Navigation“. Unsere Experten zeigen eindrucksvoll die Stärken einer durchdachten Navigation (Website). Beispiele zum Website-Navigation-Design sowie Profi-Tipps zur Analyse der Website-Navigation erwarten dich hier.
Website-Navigation: Tipps zur Analyse
Erkenntnisse über den Zustand deiner Website-Navigation bekommst du durch regelmäßige Analysen. Wenn du deine Navigationsleiste optimieren willst, solltest du unter anderem folgende Punkte im Blick haben:
Analysiere Besucherinteraktionen mit der Menünavigation auf verschiedenen Kategorieseiten (wie etwa „Men’s“, „Women’s“ usw.).
Ziel: Finde heraus, ob Besucher zum Durchsuchen von Produkten die Website-Navigation verwenden oder eher die Filterfunktion.
Wähle ein Mapping mit getrennten Kategorieseiten.
Analysiere mit dem Zonenanalysemodul die Menünavigation dieser speziellen Kategorieseiten.
Betrachte verschiedene Metriken für das Navigationsmenü, wie etwa Klickrate, Zeit vor dem ersten Klick, Hesitation Time (Dauer des Zögerns), Schwebezeit (Zeit, die auf einen CTA gezeigt wird), Kauf-Conversion Rate pro Klick.
Vergleiche die Suche und das Menü, um herauszufinden, welches Feature mehr Conversions hervorbringt.
Wähle deine Top-Landing Pages, um herauszufinden, wie deine Besucher zu anderen Seiten navigieren. Die Homepage ist beispielsweise eine der wichtigsten Landing Pages. Analysiere, welcher Kategorie-CTA auf der Homepage den meisten Traffic zu anderen Teilen deiner Website bringt (Menünavigation, Kategorie-CTAs im Textteil oder die „Jetzt kaufen“-CTAs).
Website-Navigation – ein Fazit
Die Website-Navigation ist das A und O deiner Website – ohne sie geht nicht viel. Denn finden sich deine User nicht zurecht, suchen sie schnell das Weite. Idealerweise beschäftigst du dich schon bei der Planung deines Projekts mit der Navigationsstruktur, Navigationskonzepten und der Frage: „Was sind die Elemente der Website-Navigation?“. Eine klare Navigation verbessert die User Experience und wirkt sich positiv auf die Bounce Rate und Conversion Rate aus. Schon von kleinen Optimierungen an der Website-Navigation kannst du profitieren. So können etwa schon die Änderung der Navigationsreihenfolge oder die sofortige Sichtbarkeit bestimmter Kategorien wahre Conversion-Booster sein.
Andrea is Senior Content Marketing Manager at Contentsquare. With vast experience in the B2B and digital sector, she loves sharing her insights on topics such as CX, UX, and digital marketing.