Warum Hover-Menüs problematisch sind

Hover-Menüs sind seit Jahren sehr populär im Web-Design. Doch in den vergangenen Jahren hat sich bei den Bedienungsgewohnheiten der Benutzer vieles geändert. Wie aktuell sind Hover-Menüs eigentlich noch? Kann man diese in Blogs und Websites noch gefahrlos nutzen?

1. Touch Geräte

Hover-Menüs wurden schon populär bevor das Internet mit diversen Touch-Eingabegeräten wie Smartphones und Tablets auf den Kopf gestellt wurde.

Doch den „Hover-Effekt“ gibt es auf Touch-Geräten nicht. Bestehende Menüs sollten deshalb auf jeden Fall adaptiert werden, denn falls das „alte“ Menü nicht funktioniert, droht das Usability-Chaos, und wertvolle Nutzer werden ausgeschlossen.

2. Hover Tunnel

Schlecht programmierte Hover-Menüs können Nutzer regelrecht zur Verzweiflung bringen.

Wenn die Maus nur ein bisschen abseits des von CSS gewählten Pfades kommt, ist das Menü wieder zu, oder ein anderer Menüpunkt wurde unabsichtlich gewählt.

Eine „Amazon Like Navigation“ für Hover-Menüs kann sehr gut mit einem jQuery-Plugin gelöst werden. Im Detail wird dies hier beschrieben.

3. Genauigkeit der Maus-Eingabe

Kleine falsche Bewegungen haben große, unerwünschte Wirkungen. Menü-Einträge an den oberen und unteren Rändern bergen oft die Gefahr, dass die Maus eine Spur zu weit bewegt wird, und das Menü plötzlich geschlossen ist.

Technik für Alle

Besser ist es, eine Technik zu verwenden welche auf (nahezu) allen Geräten funktioniert. Das Menü könnte erst mit einem Klick geöffnet werden. Geklickt werden kann am Computer, am Tablet, am Smartphone, und sogar mit der Tastatur.

Vorausschauend agieren

Beim nächsten Redesign einfach das Hover-Menü auf ein Klick-Menü umbauen, und für die nächsten Jahre gut gerüstet sein.

Mehr lesen, mehr Wissen.

Dein Kommentar zählt

Die Links sind NoFollow-Frei (ausgenommen Keywords, Spam etc.!)

Dieser Artikel ...

... wurde von Redaktion am 29. Dezember 2015 verfasst. Willst du mehr lesen? Der vorherige Artikel war , und sollte es einen neueren Artikel geben findest du ihn hier: