„Logo auf B1“ – Heat Maps zur Positionierung von Onlineshop-Elementen

Am 16.03.2016 in

Die Platzierung der wichtigsten Shop-Elemente, wie beispielsweise der Warenkorb oder das Logo, ist vergleichbar mit dem Spiel „Schiffe versenken“. Entweder liegt man richtig mit dem  ausgewählten Feld oder man verliert. Dies ist besonders zu beachten, wenn es darum geht, einen Onlineshop zu programmieren. Falsch platzierte Elemente sind für den Nutzer schwierig zu finden und entsprechen nicht seinen Vorstellungen. Das wirkt sich negativ auf die Kundenzufriedenheit aus. Um das zu vermeiden, haben wir uns mit den Themen Usability und User Experience auseinandergesetzt und für jedes Element Heat Maps entwickelt, welche als Richtlinie und Checkliste dienen.

Der Weg zur perfekten Positionierung

Um den bestmöglichen Platz für alle Onlineshop-Elemente zu finden, haben wir bei Projekteins 70 deutsche Onlineshops, die für den „Shop Usability Award 2015“ nominiert waren, auf 17 Elementen untersucht und ihre Positionierung auf der Startseite im  Onlineshop dokumentiert. Hierbei haben wir uns auf die reguläre Desktop-Version konzentriert und die mobile Ansicht für Smartphones und Tablets außen vor gelassen. Folgende Shop-Elemente wurden in unserer Untersuchung berücksichtigt:

  • Bezahloptionen
  • Hilfe & FAQ
  • Homelink
  • Hotline-Nummer
  • Kontaktaufnahme
  • Kundenkonto
  • Logo
  • Navigation
  • Merkzettel
  • Newsletter
  • Pop-up-Fenster
  • SEO-Text
  • Slider
  • Suchfunktion
  • Versandkosten
  • Warenkorb
  • Zertifizierungen

Mit Hilfe eines Rasters aus 40 Feldern erstellten wir für jeden Shop eine Art Oberfläche, die der Startseite eines Onlineshops ähnelt (siehe Abb. 1). Jedes Feld, das von den 70 Onlineshops verwendet wurde, markierten wir im jeweiligen Raster. Um ein eindeutiges Ergebnis zu  erhalten, verknüpften wir alle Raster eines Elementes in einem Muster und addierten die von allen Shops verwendeten Felder. Um die Häufigkeit eines Elementes in einem Feld darzustellen, erweiterten wir die Raster zu Heat Maps (siehe Abb. 2 u. 3). Die Heat Map ist eine auf 96 Felder vergrößerte, beschriftete Version des Rasters und verdeutlicht somit das Ergebnis. Die Felder werden je nach Häufigkeit ihrer Verwendung farblich markiert. Kalte Farben weisen auf selten benutze Felder hin, warme Farben auf die oft verwendeten.

Mental Map_Logo
Abb. 1: Raster für das Element „Logo“

Heat Map_Logo_Shopelemente
Abb. 2: Heat Map „Logo“ 
Heat Map_Newsletter_Shopelemente
Abb. 3: Heat Map „Newsletter“

 

Relevanz der Elemente

Die 17 untersuchten Elemente lassen sich in drei Gruppen aufteilen: Basis-, Leistungs- und Begeisterungselemente. Elemente, welche von den Nutzern vorausgesetzt werden nennt man Basiselemente. Fehlende Basiselemente in einem Shop können starke Unzufriedenheit auslösen. Sie haben jedoch keinen Einfluss auf die Zufriedenheit. Die Leistungselemente hingegen wirken sich auch auf die Zufriedenheit aus. Je mehr seiner Anforderungen erfüllt werden, desto zufriedener ist der Kunde schlussendlich. Begeisterungselemente werden vom Kunden nicht vorausgesetzt, sind jedoch gerne gesehen und verbessern das Kauferlebnis. 

Auswirkung schlechter Positionierungen

An welcher Stelle die Nutzer Elemente erwarten, hängt von der meist verwendeten Platzierung ab und führt somit im Idealfall zur intuitiven Bedienung eines Onlineshops. Bei dem Beispiel „Logo“ (siehe Abb. 2) erkennt man eine häufige Platzierung in den Feldern B1 und C1. Das Logo eines Onlineshops sollte bekanntlich auffällig platziert sein. Aus diesem Grund wählen Shopbetreiber die Position „oben links“, denn die deutsche Schreib- und Leserichtung verläuft primär von links nach rechts. Dieses Element ist somit eines der ersten, das von  Nutzern beim Öffnen eines Onlineshops gesehen wird.

Ein Element mit einer unglücklichen Positionierung kann sich negativ auf die Zufriedenheit der Kunden und auf die Konversionsrate auswirken. Eine kreative Platzierung der Elemente ist somit nicht empfehlenswert!

Nutzung der Heat Maps

Die von uns erstellten Heat Maps dienen als Checkliste für Onlineshops. Bei der Entwicklung einer neuen E-Commerce-Lösung für unsere Kunden richten wir uns nach diesen Heat Maps und wählen dadurch die optimalen Positionierungen, die sich aus unserer Untersuchung ergeben haben. Somit können wir sicherstellen, dass sich der Nutzer bestmöglich im Shop zurechtfindet und die Konversionsrate nicht fällt.

Sie sind sich nicht sicher, ob in Ihrem Onlineshop alle Elemente richtig platziert sind? Wir nehmen Ihren Onlineshop gerne unter die Lupe und optimieren die Benutzerakzeptanz der Elemente in nachhaltigen A-/B-Tests. Wir starten mit einem Workshop, der nicht nur weitere Informationen zu diesem Thema beinhaltet, sondern auch eine gemeinsame, individuelle Lösung für alle Ansichten Ihres Shops enthält. Für weitere Informationen stehen wir Ihnen gerne zur Verfügung.

Die erstellten Heat Maps für die 17 relevanten Elemente ( in alphabetischer Reihenfolge):