Consumer Insights

Landingpage-Optimierung – Tipp #3 – Schau mir in die Augen

Torsten Hubert
 Lesezeit: 4 Minuten    
17
arrow_down
17

Eine Person auf einem großem Visual schaut Sie an. Sie können Ihre Blicke kaum davon lösen, so stark ist das Bedürfnis den Blick zu erwiedern. Kennen Sie das? Ich denke, dass ist jedem von uns schon einmal passiert. Im dritten Teil meiner Serie über Landing-Page-Optimierung versuche ich den Beweis anzutreten, wie man dieses Verhalten ausnutzen kann um Landing-Pages zu optimieren

Die These: Primäre-Elemente im Blickfeld konvertieren besser

Durch das Verschieben der primär Elemente, wie z.B. die Call-to-Action,  in das direkte Blickfeld werden die Elemente besser wahrgenommen.

Der Versuchsaufbau

Mit einem kleinen Lab in unserem Eyetracker versuche ich herauszufinden, ob diese These tragbar ist oder nicht. Es wurde ein A/B-Test mit zehn Probanden durchgeführt. Jeder Proband hat nur eine Version der Landing-Page gesehen um ein klares Ergebnis zu erhalten. Es wurden jeweils zwei Messungen mit 5 Sekunden Blickzeit aufgenommen. Unterbrochen wurde die Anzeige der Landing-Page mit jeweils 5 Sekunden Rauschen um die letzte Blickposition der Nutzer wieder zu “neutralisieren”.

Die Altersstruktur von 20 bis über 60 Jahre und genau 50% Männer / Frauen. Keiner der Probanden kannte die Website, die Designvorschläge oder die Intension des Tests.

Der Test: Primäre-Elemente ins Blickfeld verschieben

Hier dient mir die Startseite der Central Versicherung als Testkandidat. Zusätzlich geht eine optimierte Version ins Rennen, bei der die primäre Call-to-Action in den Fokus rücken soll. Hier erstmal die beiden Testkandidaten zum Vergleich:

Original der Seite:

Landing-Page-Test 1 - Original

Optimierte Version:

Landing-Page-Test 1 - Optimierte Version

Der Versuch im Eyetracker soll zeigen, dass die Buttons in der optimierten Version besser wahrgenommen werden. Dies soll alleine durch den direkten Blickkontakt des Motivs hervorgerufen werden. Doch sehen wir uns die Ergebnisse der Screens als Heatmap an:

Heatmap des Originals:

Landing-Page-Test 1 - Heatmap Original

Neben dem direkten Blickkontakt zum Primär-Motiv, wird hier als zweiter visueller Aufhänger die sekundäre Call-to-Action (der gelbe Button) wahr genommen. Die primäre Call-to-Action ist nur dritt stärkstes Element.

Heatmap der optimierten Version:

Landing-Page-Test 1 - Heatmap optimierte Version

Hier sieht man schon deutlich, wie viel stärker die primären Buttons durch die Verschiebung wahrgenommen werden. Visual und Buttons “verschmelzen” nahezu zu einem großen Blickfang. Die sekundäre Call-to-Action ist in diesem Beispiel deutlich weniger gewichtet.

Fazit

Wählen Sie in Zukunft Ihre Visuals nicht mehr nur nach dem Gefallen, oder dem CI aus, sondern suchen Sie Bilder, die Ihre Kunden durch Blicke fesseln und platzieren Sie im Umfeld des Blickpunktes Ihre gewünschte primäre Call-to-Action. Sie wird dort besser wahrgenommen.

Konversionskraft ad-on Landing-Page-Test

Das ganze Thema der Blicke hat mich so fasziniert, dass ich unbedingt noch einen weiteren Test durchführen musste. Einige Zeit habe ich nach dem richtigen Testkanditaten gesucht und bin ebenfalls im Versicherungsektor fündig geworden:

Original der Seite:

Landing-Page-Optimeriung - Test 2 Original

Diesmal dient mir die Startseite der Deutscher Ring Website als Testkandidat. Der Testaufbau und die Probanten sind exakt wie im ersten Test.

These 2: Visuals können Blicke lenken

Ich glaube, dass es möglich ist durch entsprechend starke Bilder die Wahrnehmung auf Call-to-Action zu lenken, ohne das direkter Blickkontakt nötig ist. Stattdessen versetzen sich die Betrachter in die Person auf dem Bild und schauen dort hin, wo die Person hinsieht.

Optimierte Seite:

Landing-Page-Optimeriung - Test 2 optimierte Version

In der optimierten Version wurden die Buttons in die Blickrichtung der Person auf dem Visual verschoben.

Der ad-on Landing-Page-Test

Heatmap Original:

Landing-Page-Optimeriung - Test 2 Original Heatmap

In der Heatmap fällt auf, dass der Blick sehr unruhig ist, und dass das Auge keinen richten Ruhepunkt findet. Besonder interessant finde ich, dass im rechten Teil des Bildes auf den Seifenblasen eine deutliche Einfärbung in der Heatmap zu sehen ist, obwohl dort eigentlich keinerlei relevante Informationen stehen.

Heatmap optimierte Version:

Landing-Page-Optimeriung - Test 2 - Heatmap optimierte Version

WOW! Was ein klarer Unterschied zur ersten Heatmap. Die Blicke zentrieren sich auf den neu positionierten Buttons und brennen sich förmlich in die Heatmap. Durch diesen extremen Fokus beruhigt sich der Rest der Heatmap natürlich deutlich. Ein so klares Ergebnis des Tests hätte ich nicht erwartet.

Noch deutlicher wird das Ergebnis, wenn man sich die Tunnelgrafiken der beiden Versionen der Seite ansieht. In Tunnelgrafiken werden die Bereich mit besonders intensiven Blickkontakt angezeigt, der Rest des Bildes erscheint schwarz. Somit entsteht eine Art Schlüssellochbild.

Tunnelgrafik Original:

Landing-Page-Optimeriung - Test 2 - Tunnelgrafik Original

“Wie sie sehen, sehen sie alles.” So oder so ähnlich, könnte der Kommtar zu dieser Grafik sein. Der nicht vorhandene Fokus wird hier noch deutlicher. Fast die komplette Seite ist “aufgedeckt”

Tunnelgrafik optimierte Version:

Landing-Page-Optimeriung - Test 2 - Tunnelgrafike optimierte Version

Auch hier das Ergebnis absolut eindeutig. Der Fokus der Betrachter liegt klar auf der primären Call-to-Action. Alle anderen Bereich treten stark in den Hintergrund.

Fazit:

Nicht nur der direkte Blickkontakt zieht die Blicke der Nutzer auf sich, sondern durch geschicktes Kombinieren von starken Bildern lassen sich die Blicke der Nutzer lenken. Und das sogar ohne direkten Blickkontakt!

Ich wünsche Ihnen viel Spaß beim Optimieren und schauen Sie Ihren Bildern in die Augen!

Über den Autor

Torsten Hubert

Principal Consultant

Torsten Hubert, Jahrgang 1975, ist Principal Consultant bei konversionsKRAFT – Deutschlands führende Agentur für Conversion Optimierung.

Torsten Hubert beschäftigt sich seit Mitte 2000 intensiv mit der Optimierung von eCommerce Systemen, Webmarketing und ist Google Advertising Professional. In den letzten Jahren hat er in vielen erfolgreichen Projekten tiefe Einblicke in die Themenbereiche E-Commerce-Systeme, Usability, Motivatorik, Conversion-Optimierung, Landingpages, Webmarketing (SEO & SEA) sammeln können.

Weiterhin ist Torsten Hubert Dozent für Conversion Optimierung, Usability und Motivatorik an der Hochschule Darmstadt.

Sein kostenloses eBook “Die stummen Schreie der Konversion – 11 Konversionskiller und wie sie vermieden werden” wurde bisher über 13.000 Mal heruntergeladen.

Das Knowhow von Torsten Hubert wird von Fach- und Publikumsmedien gleichermaßen aufgegriffen. So erschienen Artikel bereits in Publikationen wie iBusiness, Website Boosting, InternetWorld und weiteren Magazinen.

Frage zum Artikel? Frag den Autor!

Welche Frage hast du an den Autor?

5 [contact-form-7 id="53320" title="Autorkontakt"]

17 Kommentare

  1. Gravatar

    Rene,

    Cooler Post. Kurze Frage, werden außer Blickfeld-Analysen nachher auch die Wirkung abgefragt? Also, welchen Eindruck die Seite auf die Befragten macht? Könnte mir vorstellen, dass zwar die Buttons beim ersten Beispiel besser gesehen werden, der Gesamteindruck der Seite sich aber verringert. Das zweite Beispiel zeigt eine bessere Eignung. Sehr schöner Hinweiß mit der Eignungsüberprüfung des Key-Visuals.

  2. Gravatar

    Torsten Hubert,

    Hallo Rene,

    leider ist das “nur” ein reiner Wahrnehmungstest. Da es sich bei den Websites nicht um Kunden von uns handelt, können wir die Auswirkung auf die reale Konversionsrate nicht feststellen. Vielleicht lesen die Betreiber der Websites ja den Blog und Testen die Elemente einmal in einem A/B-Test gegeneinander und teilen uns die Ergebnisse mit.

  3. Gravatar

    Webstandard-Team,

    Klasse Beitrag Torsten mit wunderbaren Screens, die aufzeigen das mit wirklich kleinen Veränderungen eine große bzw. verbesserte Wirkung erzielt werden kann.

  4. Gravatar

    Sergej Müller,

    Absolut lesenswerter Post mit viel Gehalt. Herzlichen Dank dafür, wieder was gelernt.

  5. Gravatar

    Rene,

    Hehe 😉 Jetzt wo Kaltakquise anders so schwierig ist 😛

    Ja, aber bei Euren Beratungen. Befragt ihr neben A/B Test auch einen Teil der Kunden?

  6. Gravatar

    Torsten Hubert,

    @Rene: Im Rahmen der Beratung unserer Kunden liegt der Fokus klar auf der Befragung der Kunden. Mit Hilfe unseres MotivationLabs® finden wir hier die wirklichen Motivatoren und Demotivatoren für / gegen eine Konversion heraus.

  7. Gravatar

    Thomas Rentschler,

    Wunderschöner Beitrag, hoher Informationsgehalt. Danke.

  8. Gravatar

    Malte Landwehr,

    Zwei sehr gute Beispiele für Conversion-Optimierung. Wobei mich bei diesen beiden Seiten noch interesssieren würde, was bei gespiegeltem Design (also Buttons links und Person recht) passiert.

  9. Gravatar

    Dirk E. Schneider,

    Vielen Dank, die Beiträge dieser SErie zeigen, dass es einen methodischeren Ansatz gibt als das bloße “Austesten” von oberflächlichen Ideen. Hier wird Wahrnehmungs- und Konsumpsychologie messbar gemacht. Ich freue mich auf weitere Beiträge!

  10. Gravatar

    Max Holde,

    Hallo Torsten, wirklich tolle Versuche! Die mich als Designer dazu bringen noch genauer darauf zu achten wie ich Elemente anlege. Vielen Dank!

  11. Gravatar

    toto,

    ein guter Beitrag.
    Auch wir setzen landingpages ein und werden diesen Beitrag weiter beobachten.
    Weiter so!

  12. Gravatar

    Didi,

    Zwei sehr gute Anschauungsbeispiele die es sehr gut verdeutlichen!

  13. Gravatar

    Daniel,

    Wunderschöner Beitrag mit hohem Informationsgehalt. Danke.

  14. Gravatar

    Svenni,

    Ein wirklich interessanter Test. Besten Dank für die aufschlussreichen Infos. =)

  15. Gravatar

    Michael Klomfass,

    Thanx! Wenn man mal von den zahlreichen Rechtschreibfehlern absieht, ein wirklich sehr wertvoller Beitrag.

  16. Gravatar

    Manuel,

    Wow, das ist beeindruckend. Es ist unglaublich worauf man heutzutage achten muss.

  17. Gravatar

    Christoph,

    Klasse Artikel. Bin ein großer Fan vom Gesichtern in Websites zur Aufmerksamkeits- und Sympathie-Steigerung. Die Beweisführung der Verknüpfung von Gesichtsabbildung und call-to-action-Button ist super-überzeugend.

Schreibe einen Kommentar

Teile diesen Artikel

Kostenlos anmelden