Maus-Etikette für gutes Webdesign
Dass der Hand-Zeiger im Web für das "Klicken" steht, ist ein weit verbreiteter Irrglaube. Der weite Einsatz des Hand-Zeigers für Schaltflächen, um diese zu animieren, ist falsch und problematisch. Lesen Sie hier, wozu der Hand-Zeiger dient und wie Sie dessen richtigen und falschen Einsatz künftig auf den ersten Blick erkennen.
Hand-Zeiger sind in Menü- und Schaltflächen unnötig
Haben Sie in Menüs oder Schaltflächen Ihres Browsers jemals Ihre Maus zu einem Hand-Zeiger verändert gesehen? Nein? Das ist kein Zufall. Diese Zeigerform würde an dieser Stelle verwundern. Dabei ist gerade in einem Browser praktisch jedes Element klickbar: Vor- und Zurück-Schaltflächen, Registerkarten und das Setzen von Lesezeichen.
Bei keiner dieser Schaltflächen erscheint ein Hand-Zeiger, doch die Klick-Funktion bleibt erkennbar. Die Aufmerksamkeit wird hier durch klare Texte oder Symbolik erreicht, sowie durch die Formgebung der Schaltflächen. Auch Auswahlfelder und Lautstärke-Regler sind auch ohne Hand-Zeiger eindeutig als Element zum interagieren erkennbar.
Die Funktion des Hand-Zeigers
Der Hand-Zeiger dient dazu, einen Link anzuzeigen. Anders als Schaltflächen haben Links allein keinen Aufforderungscharakter. Hier ist die Veränderung des Mauszeigers zu einer Hand eine wichtige Hilfe für den Nutzer, das er den Link klicken und so eine andere Seite aufrufen kann.
Im Browser ist jeder Link zusätzlich mit einem spezifischen Rechts-Klick Repertoire verbunden. Diese Funktionen reichen von "Öffnen in einem anderen Fenster" bis hin zu "Link-Adresse speichern". Eine Schaltfläche besitzt keine dieser Eigenschaften, die mit dem Anblick eines Hand-Zeigers jedoch ebenfalls fest verbunden sind.
Was sagen Spezialisten für Benutzeroberflächen?
Microsoft schreibt in seinem Design-Guide [https://docs.microsoft.com/de-de/windows/win32/uxguide/inter-mouse] sehr ausführlich über die Verwendung der Maus und des Mauszeigers. Dort wird die Maus als digitale Umsetzung der menschlichen Hand beschrieben.
Eine Benutzeroberfläche sollte möglichst natürlich zu benutzen sein, heißt es bei Microsoft. Dinge, die zum Drücken einladen, wie eine Schaltfläche, werden gedrückt. Objekte, die zum Ziehen einladen, wie ein Lautstärke-Regler, werden gezogen. Dagegen haben Links nur einen sehr geringen Aufforderungscharakter. Für Links ist es daher sinnvoll und notwendig, dem Nutzer durch die Änderung des Mauszeigers einen zusätzlichen Hinweis zu geben.
Auch das World Wide Web Consortium (W3C), das Gremium zur Standardisierung der Benutzeroberfläche im Web, besagt in seinen Richtlinien [https://www.w3.org/TR/CSS22/ui.html] klar: Das Hand-Symbol beschreibt einen Link. Für eine gute Benutzer-Erfahrung ist ein klares und einheitliches Design wichtig. Nur so kann der Nutzer die Webseite schnell und intuitiv verstehen.
Was ist ein Link, was eine Schaltfläche?
Ein Link dient dazu, den Nutzer zu einem neuen Ort zu führen. Das mag ein anderer Bereich der gleichen Seite sein oder auch eine ganz andere Website. Ein solcher Link kann von einem Besucher in dem gleichen oder einem anderen Browser-Fenster geöffnet werden. Außerdem bietet jeder Link die Möglichkeit, ein Lesezeichen anzulegen.
Der Klick auf einen Link wird jedoch niemals Daten speichern, ändern oder andere Einstellungen im Front- oder Backend vornehmen. Wenn mit dem Klick Aktionen ausgelöst werden, die über das reine Weiterleiten hinausgehen, dann handelt es sich nicht mehr um einen Link, sondern eine Schaltfläche. Die Anmeldung zu einem Newsletter oder die Eingrenzung auf eine geografische Region oder Produktgruppe sind Beispiele für Schaltflächen.
Fazit
Eine Schaltfläche lädt durch gutes Design zum Klicken ein. Visuelle Effekte beim Darüberfahren mit der Maus können diese Einladung noch verstärken. Das Hand-Symbol ist dagegen für Links reserviert. Das liegt daran, dass diese in Ihrer Funktion einzigartig sind.
Wenn ein Webseiten-Besucher das Hand-Symbol als Mauszeiger sieht, erwartet er einen Link. Nutzen Sie dieses Wissen, um Webseiten für die Besucher optimal zu gestalten.
