Ein Mouseover, auch Rollover oder Hover genannt, ist eine spezielle Technik, die auf einer Website oder in einer Software Anwendung findet. Beim Bewegen des Maus-Zeigers auf ein mit einem Mouseover versehenen Element, tritt eine Veränderung in diesem Element ein. Dieser Effekt wird häufig in der Navigation einer Website sowie bei Hyperlinks, Grafiken oder Buttons verwendet. Fährt man mit dem Mauszeiger zum Beispiel wie oben im Bild über einen Link, färbt sich dieser grün ein. Die Einfärbung verschwindet wieder, sobald der Mauszeiger von dem Link genommen wird. Die Realisierung eines Hovers erfolgt bei Websites über die Stylesheet-Sprache CSS (Cascading Style Sheets) oder über JavaScript.
Ein Mouseover dient als Bedienungshilfe und soll den Nutzer darauf aufmerksam machen, dass sich eine Funktion hinter dem jeweiligen Element verbirgt und diese beim Anklicken ausgeführt wird. Optisches Feedback ist ein wichtiges Kriterium für eine benutzerfreundliche Handhabung und essentiell für eine gute Usability.
Mouseover Anwendung
Rein statische Webseiten haben ein großes Problem – und zwar, dass die Aufmerksamkeit schnell verloren geht. Viele Besucher einer Seite wünschen sich Abwechslung bei der Betrachtung von Bildern oder Elementen. Der Besuch einer Website sollte mit einem Erlebnis zu verknüpfen sein, damit Besucher wiederkehren und Interessenten zu Kunden werden. Statische Seiten kreieren diesen nur in den seltensten Fällen.
Ein Mouse-Hover kann ein Element größer hervorheben, damit wird dieses sichtbarer und fängt die Aufmerksamkeit des Betrachters ein. Mit einem modernen und interaktiven Design wirkt eine Seite ansprechender, kreativer sowie aussagekräftiger und hat die Chance einen bleibenden Eindruck bei den Nutzern zu hinterlassen.
Mit Hover-Effekten können Webseiten und Inhalte dynamischer gestaltet werden und tragen dazu bei, dass Besucher Abwechslung und Spannung finden. Zusätzlich kann die Übersichtlichkeit einer Seite mit Mouseover-Effekten erhöht werden – allerdings sollten diese maßvoll eingesetzt werden. Bei der Gestaltung des Hover-Effekts ist es wichtig, eine gewisse Konsistenz zu schaffen und Website-Besucher nicht zu verwirren oder zu überfordern. Zu viele Effekte parallel zu verwenden sollten vermieden werden, da dies zu einer Reizüberflutung führen kann, die den Besucher abschreckt.
Mouseover auf mobilen Endgeräten
Während der Mouseover-Effekt die Desktop-Varianten von Webseiten innovativer und intuitiver gestaltet, stellt eben diese Mechanik eine besondere Herausforderung für mobile Endgeräte da. Der Mauszeiger, der das Medium für diese Technik bildet entfällt auf Smartphones und Tablets vollständig. Die Mehrfingergestenerkennung ersetzt auf mobilen Geräten vollständig die Maus und den Cursor. Ein Hover-Effekt ist nicht mehr existent, da man mit dem Finger sofort auf die gewünschte Stelle tippt.
Mit dem Sony Floating Touch oder dem Apple Patent für Touch Panels haben Gerätehersteller Versuche gestartet dieses Problem zu lösen – allerdings ohne großen Erfolg. Dadurch das einige Geräte sowohl Touch- als auch Maus-Bedienung unterstützen, konnte keine ganzheitliche Lösung kreiert werden. Umso wichtiger für die Usability einer Seite wird dadurch ein responsives Design und die Optimierung auf die mobile sowie die Desktop Variante.
Webseiten optimieren mit njoy
Als Webdesign-Agentur optimiert njoy online marketing deine Website! Wir analysieren und verbessern deinen Internetauftritt, damit du das Beste aus deiner Website rausholen kannst. Wir beraten dich gerne in Sachen Gestaltung und Design. Kontaktiere uns jetzt über unsere Kontaktmöglichkeiten weiter unten und profitiere von unserer Webdesign Expertise. Wir freuen uns dich unterstützen zu können!
Inhaltsverzeichnis
Ihre unverbindliche Anfrage
Nutzen Sie unser Kontaktformular
…oder kontaktieren Sie uns direkt!
Ihr Ansprechpartner
Wir sind für Sie da
Montag – Freitag
von 9:00 bis 18:00 Uhr
Anschrift
Hohenstaufenring 62
50674 Köln