Navigationsmenüs erstellen und verwalten

Die Navigation ist eines der wichtigsten Elemente jeder Website. Egal wie attraktiv das Design oder wie wertvoll die Inhalte – Besucher, die Informationen nicht schnell finden, verlassen die Seite. Ein gut gestaltetes Navigationssystem hilft Besuchern, sich natürlich durch eine Website zu bewegen, wichtige Inhalte zu entdecken und gewünschte Aktionen ohne Verwirrung durchzuführen.

In WordPress (*) verbinden Navigationsmenüs Seiten, Beiträge, Kategorien und andere Inhalte zu einer logischen Struktur, die Besucher zu ihren Zielen führt. Mit dem Wachstum einer Website wird ein effektives Menümanagement immer wichtiger: Eine Website mit fünf Seiten benötigt vielleicht nur ein einfaches Menü, während eine Website mit Hunderten von Seiten sorgfältig geplante Navigationssysteme, Dropdown-Strukturen und mobilfreundliche Designs braucht.

Website-Navigation verstehen

Website-Navigation bezeichnet das System, das es Besuchern ermöglicht, von einem Bereich zum anderen zu wechseln. Sie dient als Wegweiser: Besucher verstehen damit, wo sie sich befinden, wohin sie als Nächstes gehen können und wie Informationen organisiert sind.

Die primäre Navigation erscheint auf den meisten Websites im oberen Bereich der Seite, weil Besucher sie dort erwarten. Gängige Menüpunkte sind Startseite, Über uns, Leistungen, Blog, Ressourcen und Kontakt. Eine schlechte Navigation erhöht die Frustration der Besucher, steigert Abbruchraten, senkt das Engagement und verringert Konversionsraten. Effektive Navigation schafft dagegen Vertrauen und ermutigt Besucher, die Website weiter zu erkunden.

Das Ziel ist immer Einfachheit, Klarheit und Benutzerfreundlichkeit – gestaltet aus der Perspektive des Besuchers. Website-Betreiber kennen ihre eigene Inhaltsstruktur oft gut, aber Besucher sehen die Seite zum ersten Mal und benötigen klare Orientierung.

Zwei Wege zur Navigation: Klassische Themes vs. Block-Themes

Ein wichtiger Aspekt, den das Original-Kapitel vollständig übersieht: WordPress (*) bietet je nach Theme-Typ zwei völlig unterschiedliche Systeme zur Navigationsverwaltung. Wer das nicht weiß, sucht möglicherweise vergeblich nach Menüs oder Einstellungen, die es in seinem Theme gar nicht gibt.

Merkmal	Klassisches Theme	Block-Theme
Hauptwerkzeug	Design → Menüs	Design → Editor (Site Editor)
Menüerstellung	Im Menü-Dashboard per Formular	Visuell im Navigationsblock
Zuweisung	Menüpositionen (z. B. „Primäre Navigation“)	Block direkt im Header-Vorlagenteil platziert
Live-Vorschau	Eingeschränkt (Customizer)	Vollständig visuell im Site Editor
Menü-Dashboard verfügbar?	Ja	Nein (wird durch Site Editor ersetzt)

Kurz zusammengefasst: Bei klassischen Themes erstellst du Menüs über das Dashboard unter Design → Menüs und weist sie dann vordefinierten Positionen zu. Bei Block-Themes gibt es diesen Bildschirm nicht – dort bearbeitest du die Navigation direkt visuell im Site Editor als Navigationsblock innerhalb des Header-Vorlagenteils.

Navigation mit klassischen Themes: Design → Menüs

Wenn du ein klassisches Theme nutzt, verwaltest du alle Menüs über Design → Menüs im Dashboard. Dort erstellst du benannte Menüs, fügst Elemente hinzu und weist das fertige Menü einer oder mehreren Menüpositionen zu, die dein Theme bereitstellt.

Schritt für Schritt: Menü mit klassischem Theme erstellen

Im WordPress (*)-Dashboard zu Design → Menüs navigieren.
Auf „Ein neues Menü erstellen“ klicken.
Einen beschreibenden Namen vergeben, z. B. „Hauptnavigation“ oder „Fußzeile“.
Auf „Menü erstellen“ klicken.
Links hinzufügen: Links erscheinen Seiten, Beiträge, Kategorien, benutzerdefinierte URLs oder externe Links. Durch Aktivieren eines Kästchens und „Zum Menü hinzufügen“ werden sie ins Menü übernommen.
Reihenfolge anpassen: Menüpunkte per Drag & Drop in die gewünschte Reihenfolge ziehen.
Menüposition zuweisen: Im Abschnitt „Menüeinstellungen“ die passende Menüposition aktivieren (z. B. „Primäre Navigation“ oder „Fußzeile“). Welche Positionen verfügbar sind, hängt vom aktiven Theme ab.
Auf „Menü speichern“ klicken.
Website in der Vorschau prüfen.

Die Zuweisung zu einer Menüposition ist ein Schritt, den Einsteiger oft vergessen: Ein gespeichertes, aber nicht zugewiesenes Menü erscheint nicht auf der Website.

Welche Inhalte kannst du einem Menü hinzufügen?

Im klassischen Menü-Dashboard stehen dir folgende Elemente zur Verfügung:

Seiten (einzeln auswählbar)
Beiträge
Benutzerdefinierte Links (z. B. externe Websites oder Anker-Links auf derselben Seite)
Kategorien
Schlagwort-Archive
Produkte (bei WooCommerce)

Bei Bedarf kannst du auch mehrere Menüs anlegen – zum Beispiel ein separates für Hauptnavigation, Fußzeile und mobile Ansicht. Jedes Menü kann unabhängig befüllt und zugewiesen werden.

Navigation mit Block-Themes: der Navigationsblock im Site Editor

Bei Block-Themes findet die gesamte Navigationsverwaltung im Site Editor statt. Den Design → Menüs-Bildschirm gibt es dort nicht. Stattdessen bearbeitest du die Navigation direkt als Navigationsblock innerhalb der Header-Vorlage oder anderer Vorlagenteile.

Navigationsblöcke bieten eine vollständig visuelle Methode: Du siehst sofort, wie das Menü auf deiner Website aussieht und ausgerichtet ist. Änderungen werden in Echtzeit angezeigt, ohne dass du zwischen verschiedenen Bildschirmen wechseln müsstest.

Schritt für Schritt: Navigation im Site Editor bearbeiten

Im Dashboard zu Design → Editor navigieren.
In der linken Seitenleiste „Vorlagenteile“ wählen und den Header öffnen.
Den Navigationsblock im Header auswählen (oder über die Listenansicht suchen).
Menüpunkte hinzufügen: Über das Plus-Symbol im Block können Seiten, Links oder andere Elemente eingefügt werden. WordPress schlägt bestehende Seiten automatisch vor.
Reihenfolge der Menüpunkte per Drag & Drop anpassen.
Designoptionen konfigurieren (Ausrichtung, Abstand, Typografie, Farben).
Änderungen speichern.
Website auf Desktop und Mobilgerät prüfen.

Anpassungsoptionen des Navigationsblocks

Der Navigationsblock bietet verschiedene Designoptionen in der Einstellungs-Seitenleiste:

Ausrichtung der Elemente – links, mittig, rechts oder mit Abständen verteilt (Justify).
Orientierung – horizontal (klassische horizontale Menüleiste) oder vertikal (Menüpunkte untereinander, nützlich für Seitenleisten).
Abstand – der Abstand zwischen einzelnen Menüpunkten.
Typografie – Schriftgröße, Schriftstil und Schriftfamilie für die Menüpunkte.
Farben – Textfarbe, Hintergrundfarbe und Hover-Farbe für Menüpunkte.

Diese Optionen ermöglichen es dir, das Navigationsdesign präzise an die globalen Branding-Anforderungen anzupassen. Das Original-Kapitel listete „Ausrichtung“ doppelt auf – tatsächlich handelt es sich um zwei verschiedene Einstellungen: Elementausrichtung (links/rechts) und Orientierung (horizontal/vertikal).

Dropdown-Menüs erstellen

Wenn Websites wachsen, reicht ein einfaches Menü oft nicht mehr aus. Dropdown-Menüs erlauben es, verwandte Inhalte unter einem übergeordneten Element zu gruppieren und so eine übersichtlichere Navigationsstruktur zu schaffen, ohne das Hauptmenü zu überladen. Anstatt zum Beispiel jede Dienstleistung direkt im Hauptmenü anzuzeigen, könnte das Menü so aussehen:

Leistungen
– Webdesign
– Website-Wartung
– SEO-Dienstleistungen
– Content (*)-Erstellung

Besucher fahren mit der Maus über den übergeordneten Punkt „Leistungen“ und sehen die Unterelemente. Auf Mobilgeräten öffnet sich das Dropdown durch Tippen.

Schritt für Schritt: Dropdown in klassischen Themes

Ein Menü öffnen (Design → Menüs).
Alle gewünschten Seiten hinzufügen.
Unterelemente direkt unter dem übergeordneten Element leicht nach rechts verschieben (Drag & Drop).
WordPress erstellt daraus automatisch eine Dropdown-Struktur.
Menü speichern und in der Vorschau prüfen.

Schritt für Schritt: Dropdown im Navigationsblock (Block-Themes)

Einen Menüpunkt im Navigationsblock auswählen.
Auf das Symbol „Untermenü hinzufügen“ in der Block-Werkzeugleiste klicken.
Unterelemente einfügen.
Erscheinungsbild des Dropdowns über die Blockeinstellungen anpassen.
In der Vorschau prüfen.

Dropdown-Menüs verbessern Organisation, reduzieren Überlastung im Hauptmenü und verbessern die Skalierbarkeit. Übermäßige Verschachtelung sollte jedoch vermieden werden: Komplexe Dropdown-Strukturen mit mehreren Ebenen können schwierig zu bedienen sein, insbesondere auf Mobilgeräten.

Mobile Navigation

Mobiler Datenverkehr macht heute einen erheblichen Teil der weltweiten Website-Nutzung aus. Navigationssysteme müssen deshalb auf kleineren Bildschirmen genauso effektiv funktionieren wie auf Desktops. Menüs, die auf dem Desktop gut aussehen, erfordern oft Anpassungen für mobile Nutzer.

Die meisten modernen WordPress-Themes lösen das automatisch: Sie wandeln horizontale Menüs auf kleinen Bildschirmen in mobile Menüs um, die hinter dem sogenannten Hamburger-Symbol versteckt werden – drei horizontale Linien ≡, die als allgemein erkanntes Symbol für ein ausklappbares Menü gelten. Beim Antippen erweitert sich das Menü und zeigt alle Navigationspunkte an.

Empfehlungen für mobile Navigation

Menübezeichnungen kurz halten, damit sie auf kleinen Bildschirmen lesbar bleiben.
Übermäßige Dropdown-Ebenen vermeiden – tief verschachtelte Menüs sind auf Mobilgeräten schwer zu bedienen.
Navigation auf mehreren Geräten testen: Smartphone (iOS und Android), Tablet und Desktop.
Ausreichend Abstand zwischen den Menüpunkten einhalten – mobile Nutzer navigieren mit dem Daumen, nicht mit einem Mauszeiger. Zu dicht beieinanderliegende Punkte führen zu Fehltipps.
Links großzügig gestalten – der empfohlene Mindestbereich für tippbare Elemente liegt bei 44 × 44 Pixeln.

Tests auf echten Geräten decken Usability-Probleme auf, die im Browser-Simulator unsichtbar bleiben. Die Navigation sollte unabhängig vom Gerät schnell, übersichtlich und intuitiv sein.

Fußmenüs

Während die Hauptnavigation oben auf der Seite erscheint, bieten Fußmenüs zusätzliche Navigationsmöglichkeiten im unteren Bereich. Sie sind besonders nützlich für sekundäre Links, die nicht in die Hauptnavigation gehören.

Typische Inhalte eines Fußmenüs:

Datenschutzerklärung
Nutzungsbedingungen
Impressum
Haftungsausschluss
Barrierefreiheitserklärung
Support-Ressourcen
Sitemap

Durch die Platzierung dieser Links in der Fußzeile bleibt die Hauptnavigation fokussiert. Viele Besucher scrollen gezielt bis zum Seitenende, um rechtliche Informationen, Kontaktdaten oder zusätzliche Links zu finden – ein gutes Fußmenü erleichtert genau das.

Hinweis zur Terminologie: Das Original-Kapitel nennt die Seite „Datenschutzrichtlinie“ – der im deutschsprachigen Rechtsraum korrekte und in Deutschland gängige Begriff ist „Datenschutzerklärung“ (DSGVO-Pflicht). Auf dieselbe Weise wird „Haftungsausschluss“ häufig als Teil des Impressums abgehandelt.

Das Erstellen eines Fußmenüs erfolgt je nach Theme unterschiedlich: bei klassischen Themes über Design → Menüs und Zuweisung der Position „Fußzeilenmenü“; bei Block-Themes direkt im Site Editor innerhalb des Footer-Vorlagenteils. Fußmenüs sollten übersichtlich und leicht zu überfliegen sein – zu viele Links machen auch die Fußzeile unübersichtlich.

Breadcrumb-Navigation

Eine Navigationshilfe, die das Original-Kapitel nur am Rande erwähnt: Breadcrumbs (Brotkrümelnavigation). Sie zeigen dem Besucher seinen aktuellen Standort innerhalb der Website-Hierarchie:

Startseite › Leistungen › Webdesign

Dieser einfache Indikator hilft Besuchern zu verstehen, wie Inhalte organisiert sind, und ermöglicht das schnelle Zurücknavigieren zu übergeordneten Seiten. Breadcrumbs sind besonders wertvoll auf Websites mit tiefer Seitenhierarchie, in Online-Shops und auf Bildungsplattformen.

WordPress bringt keine eingebaute Breadcrumb-Funktion mit. Die gängigsten Lösungen:

Yoast SEO – eines der meistgenutzten WordPress-Plugins enthält eine vollwertige Breadcrumb-Funktion, die über einen Shortcode oder Block eingebunden wird.
Breadcrumb NavXT – spezialisiertes kostenloses Plugin mit vielen Anpassungsoptionen.
Block-Themes – einige Block-Themes bringen einen eigenen Breadcrumb-Block mit oder unterstützen Breadcrumbs über den Query-Loop.

Breadcrumbs verbessern nicht nur die Nutzererfahrung, sondern tragen auch zur Suchmaschinenoptimierung bei: Google zeigt sie in den Suchergebnissen unter dem Seitentitel an und gibt Nutzern so einen Kontext, noch bevor sie auf den Link klicken.

Best Practices für die Navigation

Erfolgreiche Navigationssysteme teilen mehrere gemeinsame Merkmale, die sich bewusst umsetzen lassen.

Klarheit vor Kreativität – Besucher sollten sofort verstehen, wofür jeder Menüpunkt steht. „Leistungen“ ist verständlicher als „Lösungen“. „Kontakt“ ist direkter als „Kontakt aufnehmen“. Mehrdeutige Bezeichnungen stiften Verwirrung.
Konsistenz – die Navigation sollte auf allen Seiten identisch sein. Besucher erwarten, dass Menüs überall gleich funktionieren. Unterschiedliche Menüs auf verschiedenen Seiten irritieren.
Wichtige Inhalte priorisieren – die wertvollsten Seiten erhalten die prominenteste Platzierung. Studien zeigen, dass Elemente am Anfang und am Ende eines Menüs die meiste Aufmerksamkeit bekommen – die sogenannte serielle Position.
Menülänge begrenzen – zu viele Menüpunkte überfordern Besucher. Fünf bis sieben Hauptpunkte gelten als Richtwert. Verwandte Inhalte lassen sich über Dropdown-Strukturen gruppieren.
Navigation aus Besucher-Perspektive gestalten – Website-Betreiber kennen ihre eigene Inhaltsstruktur, aber Besucher sehen sie zum ersten Mal. Eine neutrale Testperson zu bitten, auf der Website ein bestimmtes Ziel zu erreichen, deckt oft überraschende Navigationsprobleme auf.
Regelmäßig testen – was beim Erstellen logisch erscheint, kann aus der Besucherperspektive verwirrend sein. Website-Betreiber testen ihre Navigation am besten nach größeren Inhaltsänderungen erneut.

Die Benutzererfahrung durch Navigation verbessern

Die Navigation beeinflusst die Benutzererfahrung direkt. Ein Besucher, der schnell relevante Informationen findet, bleibt engagiert und erreicht seine Ziele – was wiederum Konversionen, Abonnements oder Anfragen fördert.

Klare Seitentitel – helfen Besuchern zu verstehen, wohin Links führen. Mehrdeutige Titel erhöhen Unsicherheit.
Suchfunktion ergänzend einsetzen – die interne Suche kann die Navigation ergänzen, wenn Besucher bestimmte Informationen nicht über das Menü finden. Du kannst einen Suchblock direkt im Header hinzufügen.
Breadcrumbs strategisch einsetzen – besonders auf tief gegliederten Websites helfen sie Besuchern dabei, ihren Weg zurückzuverfolgen, ohne auf den „Zurück“-Button zu drücken.
Navigation und SEO – interne Verlinkung über das Navigationsmenü hilft Suchmaschinen, die Struktur und Wichtigkeit einzelner Seiten zu verstehen. Gut durchdachte Navigation ist damit nicht nur für Besucher, sondern auch für die Auffindbarkeit in Suchmaschinen wertvoll.

Letztlich gilt: Je einfacher die Navigation auf einer Website ist, desto wertvoller und professioneller wirkt sie. Navigationsentscheidungen sollten immer von der Nutzerperspektive ausgehen – nicht von internen Präferenzen oder technischen Zwängen.

(*) Hinweis: Hinter einigen Links stehen Affiliate-Programme. Für Sie bleibt der Preis exakt derselbe, wir erhalten jedoch eine kleine Provision, die wir direkt in unsere kommenden Recherchen investieren. Vielen Dank, dass Sie unsere Arbeit auf diese Weise unterstützen!