Auf einer Startseite dürfen keine großen Aufmerksamkeitslücken entstehen – Wie erreicht man das?

eyetrack_01_teaserEine von vielen spannenden Fragen, mit der wir uns im Rahmen der Analyse von Blickdaten einer groß angelegten Eye-Tracking Studie in den letzten Monaten befasst haben. Eine erste Erkenntnis aus dieser Studie möchte ich Ihnen in diesem Beitrag vorstellen.

Zunächst ein paar Eckdaten zur Grundlagenstudie: Über einen Zeitraum von ca. 6 Wochen (Juli bis August 2009) wurde mit 30 Probanden im Alter von 14 bis 75 Jahren eine Eye-Tracking Studie durchgeführt. Ziel der explorativen Studie war es, die Probanden in einer möglichst natürlichen Nutzungssituation zu erreichen und sie „einfach mal“ im Internet surfen zu lassen und dabei den Blickverlauf zu messen.

Die Situation sollte ähnlich wie in einem Internet Café oder zu Hause in der privaten Nutzung von den Probanden erlebt werden. Aus diesem Grund wurde keine konkrete Aufgabenstellung zum Besuch einer Websites gestellt. So konnte eine realistische Kontaktsituation während der Blickverlaufsmessung hergestellt werden.

Ein Themenbereich, mit dem wir uns im Rahmen der Studie beschäftigten, waren die Startseiten von Onlineshops. Aus einer im Frühjahr durchgeführten Studie zur Länge von Onlineshop-Startseiten ist bekannt, dass Webnutzer nach eigenen Angaben auf der Startseite eines Onlineshops wenig oder gar nicht scrollen, so die Ergebnisse der Mehrthemenbefragung. Wie aber verhalten sich Nutzer wirklich in der freien Nutzung? Wie intensiv werden Elemente unterhalb des sofort sichtbaren Seitenbereichs einer Startseite betrachtet?

Wir untersuchten unterschiedlich lange Startseiten dreier Onlineshops: Amazon.de, Otto.de und Manufactum.de.

Sichtbare und nicht sofort sichtbare Seitenbereiche der Startseiten Otto.de, Amazon.de und Manufactum.de

Abb. 1: Sichtbare und nicht sofort sichtbare Seitenbereiche der Startseiten Otto.de, Amazon.de und Manufactum.de

Um herauszufinden, welche Bereiche der Startseiten betrachtet wurden, führten wir eine Bereichsanalyse durch. Dazu definierten wir für jede Startseite sogenannte Areas of Interest in Form einer vollständigen Bildschirmseite mit Abmaßen 1024 x 768 Pixeln. Anschließend wurde die Kontaktwahrscheinlichkeit für die einzelnen Flächen gemessen.

Kontaktwahrscheinlichkeit der Seitenbereiche in der freien Nutzung

Abb. 2: Kontaktwahrscheinlichkeit der Seitenbereiche in der freien Nutzung

Des Weiteren interessierte uns die durchschnittliche Kontaktdauer des sofort sichtbaren Seitenbereichs im Vergleich zu dem nicht sofort sichtbaren Seitenbereich.

Durchschnittliche Kontaktdauer bei der freien Nutzung der Startseite

Abb. 3: Durchschnittliche Kontaktdauer bei der freien Nutzung der Startseite

Die gemessenen Daten zeigen, dass die Kontaktwahrscheinlichkeit als auch die durchschnittliche Kontaktdauer für die nicht sichtbaren Seitenbereiche nach unten hin abnehmen. Betrachtet man sich die kumulierten Blickdaten als visualisierte Heatmap bzw. inverse Heatmap, werden die Aufmerksamkeitsschwerpunkte der Probanden wie folgt sichtbar.

Aufmerksamkeitsverteilung in der freien Nutzung auf den Startseiten

Abb. 4: Aufmerksamkeitsverteilung in der freien Nutzung auf den Startseiten

Die gemessenen Blickdaten der Probanden bestätigen somit die Befragungsdaten zur idealen Länge einer Onlineshop-Startseite und führen zu folgender Erkenntnis.

Fazit: Wenn Startseiten von Onlineshops möglichst kurz und kompakt gehalten werden, dann steigt die Chance, dass alle Elemente intensiv betrachtet werden.

Wie denken Sie darüber?

29 Kommentare zu „Auf einer Startseite dürfen keine großen Aufmerksamkeitslücken entstehen – Wie erreicht man das?

  1. Pingback: Twitter Trackbacks for Auf einer Startseite dürfen keine großen Aufmerksamkeitslücken entstehen – Wie erreicht man das? | [usabilityblog.de] on Topsy.com

  2. Pingback: Startseitenvergleich Amazon, Otto und Manufactum | ShopTrainer

  3. Monika

    Das Fazit ist nicht (ganz) logisch, es könnt auch davon abhängen, dass bei Otto.de die Bilder eindeutigst größer sind als zb bei Amazon oder Manufactum

    Otto ist außerdem ein Zweispalter –

    ich glaube sehr wohl, dass oben kompakt stehen /gezeigt werden sollte worums geht was hier los ist,

    doch für dieses oben gezogene Fazit fehlen mir eben die Einflüsse der anderen Parameter: Größe der Bilder, 2-3 spaltig verwendete Farben

    lg

  4. Rudwig Brown

    Mir fällt auf, dass hauptsächlich die Navigation abgesucht wird. Die meisten wissen also, was sie möchten.
    Über die Produktvorschläge/Werbung wird wenn, dann nur kurz drübergeschaut. Auch hier liegt der Blick eher auf den Bildern als auf dem beistehenden Text. Es ist also vorteilhaft, wenn die Vorschläge schnell erfasst/begriffen werden können (keine/wenig Details).
    Nach unten scrollt vermutlich nur jemand, der entweder nicht weiß was er will oder den Link zum Kontaktformular, Impressum etc. sucht. =)

  5. Christoph Anders Artikelautor

    Vielen Dank für die Kommentare,

    ich gebe Ihnen Recht Monika, dass die Einflüsse anderer Faktoren des visuellen Stimuli eine entscheidende Rolle bei der Betrachtung spielen. Um hier bezogen auf das Beispiel Otto.de eine valide Aussage treffen zu können, müssten verschiedene Designvarianten der Startseite von Otto gegeneinander geprüft werden. Hier soll zunächst explorativ dargestellt werden, dass die Nutzer in diesen drei Beispielen wenig die unteren Seitenbereiche genutzt haben mit der Schlussfolgerung, eine Startseite durchaus kompakter gestalten zu können, um die Chance zu erhöhen, dass möglichst viele Elemente vom Webnutzer betrachtet werden.

    Den Nutzern wurde keine konkrete Aufgabenstellung gegeben, sondern sie haben selbst nach ihren eigenen Intentionen entschieden, welche Bereiche sie nutzen, um tiefer in die Onlineshops einzusteigen.

  6. Monika

    Ja Herr Anders -wobei ich unter *kompakter* auch verstehe einfach das Angebot zu reduzieren, weniger Auswahl – eher die Chance, dass eine Auswahl getroffen wird.

    Technisch sollt es dennoch möglich sein auch noch genug Text unterzubringen, denn was nützt eine kompakte Seite, die nicht gefunden wird (werden kann )

    lg

  7. Patric Schmid

    Eine klare Take-Away Message ist auf jeden Fall dass in den oberen Gebieten einer Seite die (für den Nutzer) wichtigsten Informationen stehen sollten. Ich würde jedoch nicht soweit gehen eine kompakte Seite als das non-plus-ultra zu verkaufen.
    .
    In einigen Anwendungsfällen ist es sicher sinnvoll lange Produkt-Seiten zu generieren. z.B. wäre doch mal ein Vergleich interessant:

    Nutzeraktzeptanz von Suchergebnisseiten (Produktseiten) differenziert nach
    A(je 10 Ergebnisse mit „Blätterfunktion“) vs. B(„endlose“ Suchergebnisliste, dynamisch nachgeladen und mitscrollendem Suchfeld)
    .
    Grüße aus Konstanz
    Patric

  8. linda

    Ich kann den Erkenntnissen, die Herr Anders aufzeigt nur zustimmen, unsere Erfahrungen sind identisch. Eine Reizüberflutung auf der Startseite macht keinen Sinn, lieber kompekt und klar und eindeutige Einstiegsmöglichkeiten (Navigation, Suche, Teaser…).

    Nicht zu viele Teaser, das Gehirn kann zu viele Informationen nicht verarbeiten und der User verliert die Orientierung. Und die Aufmerksamkeit sinkt. Kognitiver Aufwand entsteht.

    Viele und lange Texte machen auch wenig Sinn, zumindest aus Usability-Perspektive. Hier sollte ein Kompromiß aus Usability und SEO geschlossen werden.

    Weitere Stichworte: Chunks. Und die Abneigung gegen Scrollen.

    LG, Linda

  9. Monika

    Die Abneigung gegenüber Scrollen ist ein sehr alter Mythos, der noch aus der Zeit der Frames rührt wo man die Maus bewegenmußte,weil es mehrere Scrollbalken gibt.

    Meine Erfahrungen zeigen, dass die Abneigung gegenüber Scrollen etwas ist, was immer wieder wiederholt wird , obwohl es schon urewigst nicht mehr nachprüfbar getestet wurde ;).

    Wer keinen Text hat kann bei Google nur unter Adwords oder anderen irren Kosten gefunden werden, Text braucht es daher, ob der oben in Tabs steckt oder unten auf der Seite ist Geschmackssache.

    Wenn die „aufreizende Blondine“ halbwegs in der guten Mitte einer zu scrollenden Seite ist – wird gescrollt.

    Doch ich bin sehr wohl dafür, dass das wichtigste im allerersten Viewport steht.

    lg

  10. linda

    Ich finde, der „Mythos“ ist Realität. Nicht ohne Grund entwickeln die Shopbetreiber mehr und mehr kurze Startseiten.

    PS. Magento schreibt die Geschichte neu… ich persönlich bin gespannt bzgl. der zukünftigen Entwicklungen.

  11. Monika

    meine- also die webdesign-in.de? [ich habe ja mehrere]

    Also ich halt die für viel zu viele Eyecacher-habend ;),

    weil unter dem Key WebDesign selten kaufwillige Kunden kommen:-) – da steht sie aber nun mal oben und ich brings nicht übers Herz diesen Platz zu verändern.

    Sie hat allerdings die nötigen Texte eben in Tabs versteckt und so gut ich kann in barrierefreien.

    Doch ich weiß was gemeint ist,ich habe bloß Ängste:
    liest wer wo eine kompakte Landingpage- dann darf die ab dann nur mehr 480px hoch sein, damits auch am Black Berry noch geht (übertrieben formuliert).

    Solch klare Aussagen verleiten einige Kunden nicht das Gemeinte zu lesen, sondern Buchstabe für Buchstabe.

    Ich sehe sehr viele Shops,die auch noch das allerletzte Pünktelchen auf der Startseite haben wollen, weil das die einzig Seite ist, die via Suchmaschine gefunden wird – ich nenn dies Hofer-Stil [in De heißt diese Firma Al.di.] 😉

    der Mut zur Lücke,der Mut auf den Punkt zu kommen ist oftmals gering-wenn dazu der Artikel verhilft ist es gut.

    lg

  12. Jens Hansel

    Ich halte den Ansatz, den Mythos oder Nichtmythos des Scrollen oder Nichtscrollens der Nutzerschaft einmal systematisch Schritt für Schritt anzugehen, für sehr interessant. Bei dieser Frage sind immer noch zu viele Meinungen statt Kenntnissen unterwegs.

    Wir haben tendenziell auch die Erfahrung gemacht, dass Inhalte – die Navigation blende ich zunächst einmal aus, weil es zu scrollender Navigation sowieso kaum Erfahrungen gibt – auf der Startseite unten nicht mehr wahrgenommen und schon gar nicht geklickt werden. Meine Theorie dazu: Die Startseite ist eine Zubringerseite, die in der Regel für den Weg zu einer Detailinformation (ob gezielt oder durch treibenlassen) genutzt wird. Das ist auch die Nutzererwartung. Somit kann der Nutzer davon ausgehen, dass spannende Inhalte und Dinge, die besonders hervorgehoben werden sollen, auch oben stehen. Auf Detailseiten hingegen haben wir gemerkt, dass die Textlänge und die Scrollerfordernis völlig egal ist; über die Frage des Verteilens von Text auf mehrere Unterseiten versus langem zu scrollendem Text halten sich die Ergebnisse der Marktforschung und die Feedbacks die Waage. 50 Prozent finden verteilte oder per Ajax zu wechselnde Inhalte schöner, 50 Prozent haben gern klassisch alles auf einer Seite. Das lässt sich auch unkomplizierter drucken.

    In Bezug auf die Navigation können wir nicht bestätigen, dass das Scrollen hemmt: Tatsächlich haben wir dazu Erfahrungen, dass eine Navigation bei Standard-Bildschirmen aus dem Sichtbereich lief. Hier waren – allerdings sind die Erfahrungen alles andere als repräsentativ – keine Verluste an Klicks zu verzeichnen.

    Ergänzend: Ich spreche von Erfahrungen einer Informations-Website, und nicht einer E-Commerce-Website. Weiterhin ist der schon angesprochene Konflikt zwischen Suchmaschinentauglichkeit und Nutzerfreundlichkeit hier für mich auch sehr relevant. Das soll heißen: An weiteren Erkenntnissen sind wir natürlich interessiert.

  13. Pingback: SOHO - Auf einer Startseite dürfen keine großen Aufmerksamkeitslücken entstehen - Wie erreicht man das? | usabilityblog.de

  14. linda

    @ Jens Hansel
    Eine Startseite (wenn der User überhaupt über die Startseite einsteigt, meistens wohl eher über Deeplinks) dient der ersten Orientierung. Werde ich hier mein Ziel erreichen? Dies überschaubar zu vermitteln erscheint uns für transaktionsorientierte Websites empfehlenswert. Auf Detailebene gilt das nicht, wie sie schreiben. Hier ist der User (im besten Fall, hehe) bereits dort, wo er hinwollte, am Ziel. Nun müssen die Argumente gebracht werden, die den Kauf begünstigen bzw. bei der Kaufentscheidung unterstützen. Vgl. Kaufberatung. Da stellt das Scrollen meines Erachtens kein Problem dar.

  15. Karsten Knigge

    Ich finde vor allem einen Aspekt der Studie interessant: Wenn die Zahlen (n=30 ist ja nicht extrem viel) nicht trügen, dann ergibt sich zwischen amazon und manufactum ein interessanter Unterschied: Bei manufaktum besucht jeder 5. Besucher die Seite bis ganz nach unten. Bei amazon ist schon nach der 3. Bildschirmseite Schluss. manufaktum schafft es offensichtlich, die Besucher mehr zu fesseln (wofür auch die im Vergleich zu amazon erhöhte Nutzungsdauer sprechen könnte). Das wird meines Erachtens durch ein bis zum Seitenende klar gegliedertes gleichbleibendes Design erreicht, während die amazon-Seite etwa in der Mitte einen Bruch hat, rechts gar nichts mehr erscheint und die Bilder immer kleiner werden). Wenn jeder 5. Besucher unsere eigene Startseite bis ganz unten absurfen würde, wäre ich sehr zufrieden – schließlich hat die Seite 10x mehr Traffic als die nächst oft besuchte Unterseite…

  16. Pingback: Lesetipps für den 12. November | Blogpiloten.de - das Beste aus Blogs, Videos, Musik und Web 2.0

  17. Monika

    Herr Knigge
    öffne ich die Startseite der Domain unter ihren Namen fällt mein 1. Blick auf die Auswahl der Kurse, also nehm ich an, dass sie diese verkaufen wollen,
    und alles andere Beiwerk ist-

    wozu wollen sie dann, dass ich bis nach unten scrolle?

    Ihre Beobachtung der Unterschiedlichkeit der verglichenen Startseiten ist gut und ich gebe zu, das Geld für sehr groß angelegte Studien in dieser Richtung hätt ich gern mal so nebenbei ;).

    lg

  18. Florian Bailey

    Interessant,aber nutzlos. Habe ich weniger Elemente bekommt das einzelne Element mehr Aufmerksamkeit… dafür brauch ich keine Studie.

    Vielleicht ist das Ziel der Startseite z.B. bei amazon aber gar nicht die Aufmerksamkeit auf ein bestimmtes Element zu lenken sondern dem Nutzer zu vermitteln wie viele unterschiedliche Produkte es gibt. Oder ein anderes Ziel, was weiß ich.

  19. linda

    amazon.de als Vergleich heranzuziehen halte ich persönlich nicht für optimal. amazon.de gilt zwar als der Vorreiter im eCommerce, die Strategien sind aber nicht 1:1 auf jeden Shop adaptierbar. Aus Usability-Sicht schon garnicht :-)

  20. Karsten Knigge

    Hallo, Monika,

    schön, dass Sie als erstes die Kurse wahrnehmen – das ist unser USP, sozusagen, und den wollen wir herausstellen. Aber wie ganz viele Seiten haben wir mehrere Sachen die wir „verkaufen“ – und das wollen wir auch auf der Startseite abbilden.

    Mich bestärkt die Studie eher darin, längere Startseiten zu probieren, mit nach unten abnehmender Wichtigkeit der Themen. Und über das Design zu erreichen, dass eben doch möglichst viele ihren Finger ans Scrollrad bringen…

    Viele Grüße!

  21. estridsen

    Wie ist denn die Betrachtung der Navigation hier eingeflossen? Otto.de nutzt ja eine sehr umfängliche Layernavigation.
    Ich würde behaupten, dass daher der größte Teil der grünen Bereiche kommt. Auf den eigentlichen Teaserflächen ist aber nur sehr wenig Aufmerksamkeit.
    Allerdings gibt es einen Unterschied zwischen Produkt- und Rubrikenpromotion. Rubrikenpromos sind für deutlich mehr Nutzer von einem gewissen Grundinteresse als die einzelnen Artikel.
    Aus meiner Sicht gibt es daher sehr, sehr wenig aussagefähiges in dieser Untersuchung. A) Weil die Seiten zu unterschiedlich sind B) Layer vs. kurze Navigation

  22. Pingback: Gesunde Mischung am Samstag - Bandscheiben-Blog

  23. Pingback: TaT 11/2009Blogophone

  24. Michael Vieten

    Mir fällt in diesem Zusammenhang immer wieder auf, dass Internetseiten, besonders bei großen Firmen, trotz der demografischen Entwicklung immer schwerer zu bedienen sind. Das fängt schon bei der Schriftgröße an und geht über zu viele Produkte und ablenkende Zusatzinformationen bis hin zu einer das Angebot überlagernden Werbung. Das schreckt viele ältere Nutzer ab oder führt zu Fehlern bei der Bestellung und im Anschluss zu Frust, weil die falsche Ware bestellt wurde.

  25. Christoph Anders Artikelautor

    Vielen Dank an Sie alle für die spannende Diskussion. Es gibt viele Argumente für eine lange oder kurze Startseite die berücksichtigt werden müssen. Ein Kompromiss zwischen den Kriterien zum Auffinden der Seite, einer ansprechenden Gestaltung und der Usability sollte immer angestrebt werden.

    Interessant bei den Ergebnissen dieser Studie ist das Nutzerverhalten auf der Startseite unabhängig von den Inhalten, der Navigationsart oder anderen Gestaltungsmerkmalen. Es zeigt sich ein ähnliches Nutzerverhalten bezogen auf die durchschnittliche Kontaktdauer der nicht sichtbaren Seitenbereiche.

    Die identifizierten Verhaltensweisen aus dem Blickverlauf der Nutzer dienen dazu, diese fokussiert in Folgestudien weiter zu untersuchen. So wäre ein Variantenvergleich bzgl. der Nutzerakzeptanz bestimmter Elemente ein sehr interessante Ansatz für weitere Untersuchungen.

  26. Pingback: Themen im November 2009: Hotel-Websites, Navigation im Web, Formulargestaltung und Leseverhalten | usabilityblog.de

  27. Pingback: Beispiele für gute Flashbühnen - emotionale Ansprache und Usabiltiy Hand in Hand | usabilityblog.de

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *