Webdesign und seine Grundsätze: Infos zu Menü und Navigation
Grundsätze der SeitennavigationDas Menü und die Navigation im Allgemeinen
Klar, das Menü einer Webseite ist ein probates Mittel für die Navigation. Du hast davon schon unzählige bedient, im Idealfall ganz intuitiv, ohne es wirklich wahrzunehmen. Aber warum läuft das manchmal so intuitiv und manchmal so holprig? Wir zeigen dir die Grundsätze der Seitennavigation im Webdesign!
Gleich vorweg: Es gibt neben dem schnöden Menü in der Tat viele alternative Möglichkeiten, auf einer Webseite zu navigieren. Sicherlich gibt es für individuelle Spezialfälle auch noch bessere und intuitivere Wege – zum Beispiel für dreidimensionale Webseiten in VR. Doch für die große Masse ist das alles noch weit weg. Wir beschränken uns daher auf die Seitennavigation und das Menü: Wir zeigen dir, auf was es hier beim Design ankommt!
Sei konsistent!Das Menü sollte so aussehen wie immer
Klingt langweilig, ist für eine intuitive Seitennavigation aber unumgänglich: Wenn du dich für ein Menü, ein bestimmtes Design desselben und eine bestimmte Funktionsweise davon entscheidest – stick to it! Stell‘ dir einfach vor, das Menü ist je nach Unterseite mal oben, mal unten, mal seitlich oder vielleicht auch in der Mitte – das sorgt für Verwirrung und schreckt Besucher ab. Deine Besucher haben ein Sicherheitsbedürfnis (das ist übrigens sogar ein menschlicher Trieb). Konsistenz in deiner Navigation bedient dieses, indem es die Orientierung sichert.
Im Übrigen solltest du auch darauf achten, dass sich die Reihenfolge deiner Menüeinträge nicht verändert. Wo wir gerade dabei sind: Der erste und der letzte Menüeintrag sind die wichtigsten, bedingt durch den seriellen Positionseffekt. Das heißt, dass du den wichtigsten Eintrag stets am Anfang oder am Ende positionieren solltest.
Sei sichtbar!Um ein Menü zu bedienen, muss man es finden
Es hört sich naheliegend an, aber immer wieder trifft man auf Webseiten, bei denen es anders läuft und du dich zum Beispiel fragst, wo das Menü ist. Selbst, wenn der Besucher danach nur 2 Sekunden suchen muss, sind das 2 Sekunden zu viel: Das Menü muss so sichtbar sein, dass es sofort auffindbar ist.
Auch die Navigation selbst muss sichtbar sein, also die eigentliche Interaktion: Aus dem Kontext des Menüs sollte immer hervorgehen, welcher Teil gerade aktiv ist bzw. welcher geklickt wurde. Das klappt optisch durch Farben sehr gut, allerdings solltest du immer auf mehr als nur eine optische Funktion vertrauen und beispielsweise auch die Struktur des Menüs im Kontext verändern – zum Beispiel, indem du den geklickten Aspekt größer anzeigst.
Kleiner technischer Trick für eine bessere Usability:
Mach‘ die Box die den Klick abfängt immer etwas größer als das eigentliche Klickziel – so ist es leichter zu treffen. ¯\(ツ)/¯
Das Menü sollte auch beim Scrollen sichtbar bleiben – oder zumindest sollte es schnell wieder in Reichweite gelangen. Gerade bei Mobilseiten stellt das ein kleines Problem dar, denn es gilt einen Kompromiss zwischen Platz für den Inhalt und für das Menü zu finden. So ist es einerseits ineffizient, das Menü immer oben zu fixieren, weil damit Platz für die Inhalte verloren geht, insbesondere beim Scrollen. Andererseits verliert sich der rote Faden beim Besuch, wenn das Menü beim Scrollen ganz verschwindet – besonders bei langen Webseiten bzw. Texten.
Das absolute Minimum ist hier, am Ende des Textes einen Link zu platzieren, der per Klick wieder ganz nach oben zum Menü führt. Manche Seiten lösen es noch besser und führen beim Scrollen einen kleinen Teil des Menüs, z. B. einen kleinen Button, mit. Der expandiert sich bei Klick wieder zur vollständigen Navigation.
Sei multifunktional!Es ist immer besser, mehrere Methoden der Navigation anzubieten
Was wir damit meinen? Nun, abseits des klassischen Menüs für die Navigation, welches deine Unterseiten und Kategorien auflistet, könntest du zum Beispiel auch eine Suchfunktion zur Verfügung stellen. So kann der Besucher nach individuellen Inhalten suchen. Eine weitere Navigationsfunktion ist die Kategorisierung nach Hashtags bzw. Schlagworten oder nach Datum (ideal bei Blogposts).
Sei einfach!Ein einfaches Menü zieht wenig Aufmerksamkeit auf sich
Je einfacher ein Menü ist, desto intuitiver ist es in der Regel auch – zumindest insofern es die Erwartungen des Besuchers erfüllt und z.B. sichtbar und konsistent ist. Wir empfehlen dir also, wirklich nur die wichtigen bzw. für Besucher relevanten Seiten in deinem Menü darzustellen. Wenn es Seiten gibt, die nur sekundär oder tertiär wichtig sind, dann sollten sie entweder im Footer vorkommen oder sogar nur über interne Links im Text erreichbar sein (z.B. die Unterseiten in einem Glossar).
