14 UX-Tipps für die Hauptnavigation

Was ist bei der Gestaltung der globalen Navigation zu beachten? Die folgenden nicht erschöpfenden UX-Richtlinien für Hauptnavigationen sollen als kleine Checkliste zu Erinnerung bei der Erstellung helfen:

• nur 5 – 7 Menüpunkte verwenden, da sich das menschliche Kurzzeitgedächtnis im Schnitt genau so viele Dinge merken kann und das Menü somit leichter erfassbar ist
• als Schriftschnitt sollte „bold/fett“ verwendet werden, damit sich die Navigation vom übrigen Text abhebt und gut lesbar ist
• beim Hovern der Menüpunkte sollte eine Änderung im Design stattfinden, der Schrittschnitt sollte sich aber nicht ändern
• die Schriftgröße sollte 16 Pixel groß sein
• genug Abstand zu anderen Menüpunkten einhalten: bei einer Schriftgröße von 16px, können Paddings von 16 Pixel links und rechts und 8 Pixel oben und unten gesetzt werden
• befindet sich ein Call-to-Action in der Hauptnavigation, dann kann dieser als Button dargestellt werden (z.B.: Sign-Up als Button). Dieser wird dann allerdings rechts außen platziert.
• der Farbkontrast zwischen Vorder- und Hintergrundfarbe sollte groß genug sein um gute Lesbarkeit zu gewährleisten. In diesem Artikel lernst du wie du Farbkontraste schnell in Chrome überprüfst.
• die Navigation sollte über Tabulatoren zugänglich sein um Barrierefreiheit zu gewährleisten
• das Menü sollte auf allen Seiten sichtbar und gleich platziert sein
• Sticky Menüs: eine angeheftete Navigation am oberen Rand beim Scrollen hilft dem User schneller zu navigieren. Soll die Verweildauer auf der Website künstlich erhöht werden, so kann damit experimentiert werden, auf dieses Feature zu verzichten. Ein A/B-Test wäre in diesem Fall der gängige Weg um diese Hypothese zu überprüfen.
• einfache und prägnante Begriffe verwenden; keine Fachbegriffe
• den aktuell besuchten Menüpunkt grafisch hervorheben
• thematisch zueinander passende Navigationspunkte sollte in der Nähe platziert werden
• hat ein Link besondere Wichtigkeit, so ist dieser am Anfang zu platzieren. Dies gilt insbesondere auch bei Dropdowns