Interessante A/B-Tests zeigen dass ein Text-Button mehr Umsatz generiert und öfters geklickt wird als das oft benutzte Hamburger-Navigations-Icon.
Das Hamburger-Icon ist für Smartphone-Websites und Apps zu einem beliebten Navigationselement geworden. Doch wie verständlich ist dieses Icon? Aus unserer Erfahrung in Usability Tests ist längst nicht allen Benutzern klar, dass sich hinter dem Icon ein Navigationsmenü versteckt. Das Icon hat 2 Nachteile:
- Verständlichkeit: Das Hamburger-Icon ist nicht selbstsprechend (Drei Striche können verschiedene Dinge bedeuten)
- Sichtbarkeit: Wenn nur 3 Striche ohne Rahmen verwendet werden, sieht das Icon nicht wie ein Button aus
Dies untermauern auch drei interessante A/B-Tests im Internet. Hier zusammengefasst die Ergebnisse der 3 Tests.
1. Ein Rahmen um das Hamburger-Icon führt dazu dass es mehr geklickt wird
Der Grund ist vermutlich, dass das Hamburger-Icon dann wie ein Button aussieht.
http://exisweb.net/mobile-menu-icons
2. Der Text „Menu“ führt dazu dass der Button öfter geklickt wird
http://exisweb.net/mobile-menu-abtest
3. Der Text „Menu“ führt zu mehr Umsatz
http://conversionxl.com/testing-hamburger-icon-revenue/
Zusammengefasst kann man sagen
- Überlegen Sie sich wer Ihre Zielgruppe ist. Kennt diese das Hamburger-Icon wirklich? Im Zweifelsfall schreiben Sie „Menu“ hin.
- Verwenden Sie einen Rahmen um das Wort „Menu“ oder um das Hamburger-Icon, um zu zeigen, dass diese klickbar sind
- Vor dem Go-Live: Machen Sie Usability Tests mit der Zielgruppe, um herauszufinden was besser funktioniert
- Nach dem Go-Live: Machen Sie A/B-Tests, um herauszufinden was besser funktioniert
Andreas Bossard
Möchten auch Sie die Bedienung ihres Produktes verbessern?
Gerne unterstützen wir Sie. Wir freuen uns auf Ihre Anfrage.
Grossartige Zusammenstellung die es wunderbar auf den Punkt bringt. Was haben wir schon über die eine oder andere Variante diskutiert!
Gelegentlich ist es ganz gut dass das burger-menu nicht zuerst beachtet/geklickt wird, da wir die User durch den Inhalt navigieren. Es kann sogar völlig egal sein ob jemand da jemals draufklickt, Hauptsache ist die Conversion. Dann stellt sich die Frage anders: Wird es gefunden wenn man es wirklich sucht und braucht? Ich denke – aus eigenen Erfahrungen – das Burger-Menu hat sich in allen aufgeführten Variationen etabliert. Enorm wichtig ist jedoch auch die Platzierung und diese muss Erwartungskonform sein.
Die Platzierung wäre auch ein Test-case für eine Studie … Besonders im Umgang mit Logos, die gerne die linke Ecke beanspruchen.
Hallo Sven
Vielen Dank für deinen Input.
> Dann stellt sich die Frage anders: Wird es gefunden wenn man es wirklich sucht und braucht?
Genau das ist die wichtige Frage.
> Enorm wichtig ist jedoch auch die Platzierung
Aus meiner Erfahrung ist dies weniger wichtig, solange es klar von anderen Elementen wie Logo unterscheidbar ist. Wichtig ist zuerst mal dass das Icon 1. gesehen wird und 2. man sieht was sich dahinter verbirgt.
Darum bin ich im Blog Post auf diese 2 Punkte eingegangen. Ein erster Schritt wäre nur schon, wenn alle Hamburger-Icons einen Kontrast von 4.5:1 hätten. ( https://soultank.ch/2014/09/2-tools-fuer-gute-kontraste-damit-texte-wieder-lesbar-werden/ ) Noch besser wäre ein Rand drumherum, damit sie wie ein Button aussehen und noch besser wenn „Menu“ irgendwo steht, damit man weiss was sich dahinter verbirgt.