Heatmaps

25. Januar 2013

Heatmap für Video-Salespage auf dem Blog WissenschaftlichesInserieren.de

Heatmaps – welche Bedeutung verbirgt sich hinter dem Begriff, was nützen sie uns?

Es ist Alltag, dass uns die Medien bei jeder sich bietenden Gelegenheit mit Information regelrecht überfluten – wir leben gewissermaßen in einer Zeit des ‘Information-Overkill’. Wen wundert es da noch, dass die Aufmerksamkeitsspanne die ein Betrachter auf eine Webseite verwendet, um zu entscheiden, ob sie für ihn interessant ist oder nicht, von den Fachleuten mit wenigen Sekunden angegeben wird? In dieser sehr kurzen Zeit wird also über das ‘Wohl und Wehe’ Ihres Informationsangebotes entschieden. Gut, wenn Sie darauf vorbereitet sind und die richtigen Werkzeuge zur Hand haben!

Um es gleich vorweg zu nehmen, bei einer ‘Heatmap’ handelt es sich um die ‘optische Auswertung’ eines Bildes (in unserem Beispiel um einen Screen-Shot einer Internet Seite), die Aussagen darüber liefert, auf welche Zonen der Darstellung der Betrachter seine Aufmerksamkeit am intensivsten ausrichtet. Insofern stellen diese Bildbereiche, die ein Betrachter vorwiegend in Augenschein nimmt, im Ergebnis eine Gewichtung oder Rangfolge der betrachteten Areale dar und liefern damit grundlegende Entscheidungshilfen für die “richtige” Anordung der Elemente einer Website – oder zeigen die Mängel ihrer Positionierung auf.

Beipiel: Sie haben eine einfache Website mit einem Produktfoto oder -Video sowie eine “Opt-In-Form” auf dieser Seite, um die eMail Adressen von Interessenten einzusammeln.

Prototyp einer Sales Page von WissenschaftlichesInserieren.de

Anordung, Positionierung, Größe, farbliche Gestaltung der Elemente und so weiter, beeinflußen die Wahrnehmung des Betrachters. Die Frage die sich generell stellt ist: wird durch Ihre vorgegebene Anordnung (das Seitenlayout insgesamt) der gewünschte Effekt erzielt? Wir unterstellen hier, das der Betrachter primär das Produktfoto sehen und sich dann in die Interessentenliste eintragen soll, wobei der Klick auf den “Daten abschicken” Button die finale Krönung der gesamten Aktion bildet – und so, in diesem Fall, zum eigentlichen Ziel, der Interessentengewinnung führt, die die Adressdaten zum nachfassen liefert!

Heat Map Auswertung einer Sales Page von WissenschaftlichesInserieren.de

Und hier haben Sie das Resultat der Auswertung unserer Squeeze Page als ‘Attention Heatmap’. Zur Erstellung haben wir den kostenfreien Service auf Feng-GUI.com genutzt.
Wie Sie gut erkennen können, überlagert eine ganze Reihe farblicher, vorwiegend grüner Felder, das ursprüngliche Bild. Diese stellen die Hauptzonen dar, denen der Betrachter seine Aufmerksamkeit gewidmet hat. Anhand der Größe der Felder und ihrer farblichen Nuancierung lassen sich jetzt Aussagen über die Positionierung der strategisch wichtigen Elemente auf der Seite ableiten.

Die ‘Attention Heatmap’ simuliert eine ‘Eye Tracking’ Prozedur und zeigt im Ergebnis die attraktivsten Areale des Ausgangsbildes als ‘kalte’ oder ‘heiße’ Spots an. Wobei die Farbgebung der ‘Heatmap’ von Grün über Gelb zu Rot verläuft. Dieser Verlauf repräsentiert die Gewichtung des Aufmerksamkeitslevels von niedriger, mittlerer und hoher Intensität. Die Bereiche ohne Heatmap-Farbgebung werden vom Betrachter ausgeblendet – diese Aussage bezieht sich auf den Umstand, dass hier die Wahrnehmung des Betrachters in den ersten (Bruchteilen von) Sekunden simuliert und analysiert wird!

Die Analyse des Screen-Shots unserer Squeeze Page sieht insgesamt ganz positiv aus. Die wichtigen Elemente, die Schlagzeile (in roter fetter Schrift), das Produktvideo (auch der PLAY Button), ziehen den Blick auf sich. Vor allem aber die Opt-In-Form, hier der Bereich wo Name und eMail Adresse einzutragen sind und auch der Button zum Abschicken dieser Daten, liegen im zentralen Bereich der Wahrnehmung des Surfers. Insgesamt also ein gut gelungener Aufbau der Seite und der Anordnung der wichtigen Elemente, ganz besonders im Hinblick auf ihre Zielsetzung.
Für die Übereinstimmung der Simulation mit einer tatsächlich durchgeführtem Eye-Tracking Prozedur gibt Feng-GUI immerhin 60 Prozent Genauigkeit an (dies betrifft die kostenfreie Analyse, die Genauigkeit des kostenpflichtigen Service soll sich sogar auf 85 Prozent erhöhen und liefert zudem detailliertere Informationen).

Neben dem Modell der ‘Attention Heatmap’ haben sich weitere Auswertungskategorien etabliert: der Gaze Plot, die Opacity Map sowie die Areas of Interst.

Prototyp einer Sales Page von WissenschaftlichesInserieren.deIn dieser ‘Hot Spot’ Auswertung unserer Homepage ‘Wissenschaftliches Inserieren’, die mit der Trialversion des Dienstleisters EyeQuant erstellt wurde, sind Heatmap und Opacity Map zu einer Karte vereint. Auf dieser Hot Spots Karte werden ergänzend die aufmerksamkeitsstärksten Bereiche der Seite – durch insgesamt zehn Kreise dargestellt – noch einmal transparent über dem Screenshot markiert. Je größer die Kreise sind, desto aufmerksamkeitsstärker ist der darunterliegende Bereich.

Feng-Gui bietet neben der Attention Heatmap einen ‘Gaze Plot’ Report, einen ‘Opacity Map’ Report sowie einen ‘Areas of Interest’ Report.
Der ‘Gaze Plot’ Report stellt optisch die Abfolge des Weges dar, den der Blick des Betrachters beim ‚abscannen‘ der Seite nimmt und repräsentiert damit auch die Reihen- sowie Rangfolge der betrachteten Bildelemente. Der charakteristische strukturelle Aufbau setzt sich aus einer Reihe kurzer Stopps (fixations) und einem schnellen Wechsel der Blickrichtungen (saccades) des Auges zusammen. Die Stopp- beziehungsweise Fixationspunkte werden als Kreise dargestellt. Diese wiederum werden – mit 1 beginnend – durchnummeriert und zwar in der Reihenfolge, in der der Blick von einem Fixationspunkt zum nächsten gewandert ist. Die durchschnittliche Verweildauer an solchen Fixationspunkten wird mit ca. 200 Millisekunden angegeben wenn es sich um Textpassagen handelt. Bei der Betrachtung einer Szene werden hier als Verweildauer ca. 350 Millisekunden genannt.

Prototyp einer Sales Page von WissenschaftlichesInserieren.deDer ‘Opacity map’ Report stellt die attraktiven Bereiche der Seite, die das Interesse eines Betrachter mit hoher Wahrscheinlichkeit während der ersten Sekunde auf sich ziehen, optisch als scharf erkennbare Bereiche dar, und dunkelt jene Areale ab, die für ihn nicht attraktiv sind. Die am deutlichsten erkennbaren Bildbereiche sind demnach auch jene, die die meiste Aufmerksamkeit auf sich ziehen. Der Report wird also dazu genutzt Bildareale zu identifizieren, die wahrgenommen werden und solche zu erkennen, denen keine Beachtung geschenkt wird. (Bild: Opacity map, free trial Auswertung durch EyeQuant)

In Bezug auf die Kundengewinnung und das Verkaufen könnte man aufgrund dieser Erkenntnisse also die verkaufstärksten Elemente (wichtigsten Produktbotschaften, Call to Action, etc.) der Webseite so anordnen, dass diese als erste wahrgenommen werden; und damit sicher stellen, dass sie zeitlich auch innerhalb der Aufmerksamkeitsspanne des Besuchers liegen.

Bleibt noch der ‘Area of Interests’ Report zu nennen. Diese Areale oder auch besonderen Interessensbereiche legen Sie innerhalb des auszuwertenden Bildes selber fest.optische Auswertung - 'Areas of Interest' Report der Homepage von WissenschaftlichesInserieren.de Auf Grundlage der Heatmap-Ergebnisse wird den von Ihnen vorgegebenen Arealen der anteilige Aufmerksamkeitsgrad – im Verhältnis zum Durchschnittswert der Aufmerksamkeit den die Seite insgesamt erfährt – als Prozentsatz angezeigt. Auch dieser Report dient dazu, die Resultate verschiedener Versionen des Designs und Layouts zu vergleichen

Es gibt eine ganze Reihe Firmen, die solche Bildanalysen als Service anbieten. Aber nicht alle bieten einen kostenlosen Test ihrer Dienstleistungen. Dort wo eine Testversionen verfügbar ist, wird oft die Anzahl der berücksichtigten Auswertungskriterien und Methoden eingeschränkt und damit die Auswertung selbst auch weniger präzise. Die Unternehmen unterscheiden sich auch darin, was die Trefferquote ihrer Resultate im Vergleich zu einem real durchgeführten Eye-Tracking anbelangt. Auch die Geschäftsmodelle sowie die Preise für solche Analysen unterscheiden sich zum Teil ganz erheblich.

Natürlich macht das Sinn, im Vorhinein in Erfahrung bringen zu können, ob die optische und inhaltliche Gestaltung des eigenen Webauftrittes den Besucher zu den vordergründig gewünschten Informationen lenkt, beziehungsweise die von ihm erwarteten Reaktionen ausgelöst werden. Wie verlässlich die zum Teil unterschiedlich ausfallenden Ergebnisse der Analysen sind sollte vor Einsatz gründlich recherchiert werden. Auch welcher Kostenaufwand für die eigene Site noch vertretbar ist, muss wohl von Fall zu Fall entschieden werden. Die kostenfreien Testmöglichkeiten stellen aber sicherlich einen guten Ansatz dar, sich mit dieser Thematik auch praktisch auseinander zu setzen, um letztlich eine effiziente Webseite zum Einsatz zu bringen.

Leave a Comment

Previous post: