Mouseover bei mobilen Geräten

Was sie beim Webdesign auf modernen Geräten beachten sollten

veröffentlicht am: 24.04.13, Autor: Peter Scheel

Mouseover bei mobilen Geräten In den letzten Jahren hat sich ein neuer Gerätetyp etabliert, der sich deutlich von den früheren Desktopgeräten unterscheidet: Geräte mit Touchbedienung, wie zum Beispiel Smartphones oder Tablet PCs. Alle diese Geräte lassen sich nur durch Fingerberührungen steuern. Woran wir uns über Jahrzehnte erst allmählich gewöhnt hatten, nämlich zur Steuerung einen Mauszeiger auf dem Bildschirm zu haben, ist nun über Nacht verschwunden. Was fehlt ist der Mauszeiger, bzw. überhaupt eine Maus an sich.

mouseover ohne Maus?

Manche Tablet PCs oder Smartphones verfügen auch über eine Stifteingabemöglichkeit, manche davon bilden auch das altbekannte mouse-over event ab. Das sind aber die wenigsten. Klammern wir einmal diese Geräte kurz aus, was bleibt ist eine große Masse an smartphones und tablets.

Das ":hover" ist vermutlich der bekannsteste pseudo class selector in HTML/CSS. Jahrelang diente es dazu dem Benutzer ein zusätzliches Erlebnis auf dem Bildschirm zu präsentieren: Fuhr man mit der Maus über ein bestimmtes Objekt, wurden bereits Aktionen oder Effekte ausgelöst, ohne dass man dieses Objekt anklicken musste. Dieses mouse-over-event (:hover), funktioniert so, wie wir es aus der Vergangenheit gewöhnt sind, nicht mehr auf Geräten mit Touch-Bedienung.

Webdesign, und was nun?

Was bedeutet das nun für das Webdesign? Machen wir ein Beispiel: wir haben ein Navigationsmenü in dem sich Unternavigations-Punkte verstecken, die erst sichtbar werden, wenn man mit der Maus über die einzelnen Hauptelemente fährt. Lässt sich solch ein Menü noch zur Steuerung auf Touchgeräten nutzen? Die Antwort ist leider nicht digital, lautet also: Sowohl-als-auch. Es kommt darauf an, ob das Hauptelement als klickbarer Link ausgeführt ist, oder nur dazu dient, den mouse-over event zu ermöglichen. Ist er auch als klickbarer Link ausgeführt, werden Sie nie die Unterpunkte des Menüs erreichen, sondern durch Berührung des Hauptelementes immer das Klick-Event auslösen. Dient das Hauptelement jedoch nur dazu, das Untermenü sichtbar zu machen, kann diese Art von Menü durchaus auf einem Touch-Gerät funktionieren.

Was bedeutet das für bereits bestehende Internetauftritte?

Stellen Sie sich vor, sie hätten vor einigen Jahren ihrer Website neu gestalten lassen. Sie lehnen sich nun entspannt zurück und freuen sich über eine gelungene Desktop Version. Über Smartphones oder Tablet PCs machen sie sich nicht so viel Gedanken. Sie gehen davon aus, dass ihrer neu erstellte Desktop Version auch wunderbar auf den mobilen Geräten abrufbar ist. (Die Größendarstellung klammern wir hier einmal aus!) Doch was ist das? Sie können nicht durch ihre Seiten navigieren? Vielleicht stellen Sie jetzt genau den oben beschriebenen Effekt bei Ihrer Seite fest. Unschön, oder?

Responsive Design - Umdenken gefragt

Das zeigt einmal mehr, dass es Sinn, macht in regelmäßigen Abständen seine Internetseite neu programmieren zu lassen. Bei der Neu-Umsetzung eines Internetauftritts sollten heute Touch-Geräte auf jeden Fall mit berücksichtigt werden. Dies bedeutet auch, dass man sich bewusst sein muss, dass mouse-over Effekte nicht mehr, oder nicht immer im klassischen Sinne funktionieren!

Viel Spaß beim Webdesign!

 

Blogverzeichnis - Blog Verzeichnis bloggerei.de Bloggeramt.de