Fotos als Web-Inhalte

Die Nutzer widmen Fotos und anderen Bildern, die relevante Informationen enthalten, hohe Aufmerksamkeit, aber sie ignorieren dekorative Bilder, die nur den Zweck haben, Webseiten aufzuhübschen.

 

by Jakob Nielsen (deutsche Übersetzung) - 01.11.2010

 

Unsere Eyetracking-Studien dokumentieren eine dramatische Kluft in der Art und Weise, wie die Nutzer Bilder auf Websites wahrnehmen:

• Manche Arten von Bildern werden vollkommen ignoriert. Das ist normalerweise der Fall bei grossen Wohlfühl-Bildern, die rein dekorativen Charakter haben.
• Andere Bildarten werden als wichtige Inhalte behandelt und gemustert. Fotos von Produkten und realen Personen (im Gegensatz zu Stockfotos mit Fotomodellen) fallen oft in diese Kategorie.

Ich habe schon zahllose Kolumnen dafür gebraucht, um gegen die erste Art von Bildern zu polemisieren. Leider sind viele Websites immer noch mehr damit beschäftigt, eine gute Show hinzulegen, als damit, auf den Punkt zu kommen. Visueller Schaum verärgert weiterhin die Nutzer: Auch mit Hochgeschwindigkeits-Verbindungen und Download-Zeiten unterhalb einer Sekunde bevorzugen die Nutzer immer noch Websites, die sich auf die Informationen konzentrieren, die sie haben wollen:

• Im E-Commerce sind das Produktfotos, die den Nutzern dabei helfen, Produkte zu verstehen und zwischen ähnlichen Eigenschaften zu unterscheiden.
• Auf persönlichen Websites wollen die Nutzer die Person hinter der Website sehen; Autorenfotos sind zum Beispiel eine Schlüssel-Usability-Richtlinie für Blogs.

Um das näher zu beleuchten, wollen wir uns ein paar Beispiele aus einer Eyetracking-Studie ansehen, die wir dieses Jahr durchgeführt haben.

Fotos von Leuten = gut (wenn es reale Personen sind)

Es ist schon lange eine Richtlinie für die Online-Präsentation von Unternehmensprofilen, auch Porträts der Vorstandsmitglieder zu zeigen, damit die Nutzer mit einer ansonsten gesichtslosen Organisation reale Personen assoziieren. FreshBooks.com geht dabei noch einen Schritt weiter und präsentiert Fotos seines gesamten Teams:

Dies ist nun in der Tat eine sehr lange Seite, die ich in drei Abschnitte aufgeteilt habe, um sie hier unterzubringen. Die Originalseite war 9335 Pixel lang, und unser Testnutzer ist fast bis ganz ans Ende gescrollt. Wie das Beispiel zeigt, scrollen die Leute manchmal auch durch lange Seiten, allerdings widmen sie normalerweise den unteren Teilen der Seite immer weniger Aufmerksamkeit.

In diesem Fall hat der Nutzer 10% mehr Zeit mit der Betrachtung der Porträtfotos verbracht als mit dem Lesen der Biografien, obwohl die Biografien 316 Prozent mehr Platz einnehmen. Das Blickprotokoll zeigt deutlich, dass der Nutzer in Eile war und sich nur einen schnellen Überblick über das FreshBooks-Team verschaffen wollte, und Fotos zu betrachten geht in der Tat schneller als ganze Absätze zu lesen.

Entscheidend ist, dass dies wirkliche Personen sind, die tatsächlich im Unternehmen arbeiten.

Dagegen ignorieren die Nutzer Archivbilder von "Leuten an sich":

Dabei vermute ich, dass dieses Foto aus der Yale School of Management wirklich reale Studierende zeigt; Archivbilder wären kaum so schlecht beschnitten und würden kaum Models zeigen, die so in der Bank hängen wie der Typ im blauen Hemd.

Doch auf dieser speziellen Seite ist das Foto ein reines Füll-Element. Die Nutzer sind hier, um den Anmeldeprozess der Schule zu verstehen, und nicht um einzuschätzen, ob man es sich als Student dieser Schule leisten kann herumzuhängen.

Wahrscheinlich hat der Dekan oder ein anderer Manager die Designer gebeten, die Seite etwas aufzupeppen, damit die Universität aufregender aussieht und deshalb mehr Anmeldungen erzielt. Doch im Internet heisst aufgepeppt = ignoriert.

Wie wir in unserem Seminar "Marke als Erlebnis" diskutieren, besteht die Kunst, Kunden zu begeistern, darin, ihnen Erlebnisse zu verschaffen, die sie angehen; und das heisst, man muss sich darauf konzentrieren, ihre Bedürfnisse zu treffen. Diese Lektion gilt genauso für gemeinnützige Organisationen und Hochschulen, auch wenn sie ihr Zielpublikum nicht als "Kunden" sehen.

Produktdetails = gut

Vergleichen Sie diese beiden Beispiele für E-Commerce-Kategorieseiten (listenförmige Produktgalerien sortiert nach Kategorien) von Pottery Barn und Amazon.com:

Die Miniaturbilder von Bücherregalen wurden intensiv studiert, während die Miniaturbilder von Flachbildfernsehern überwiegend ignoriert wurden. In der Tat hat der Nutzer auf der ganzen Amazon-Seite (von der hier nur der obere Teil gezeigt wird), nur 18% der Betrachtungszeit auf die Fotos verwendet und 82% auf den Text. Im Schnitt entfielen pro Produkt auf das Miniaturbild 0,9 Fixierungen, auf die Beschreibung 4,4 Fixierungen.

Der Unterschied zwischen den beiden Screenshots liegt auf der Hand: Die Fernseher-Fotos sind keine Hilfe, wenn es darum geht, sich für eines der Produkte zu entscheiden. Ein Kanut oder ein Fussballspieler? Wie bitte? Weil ich häufiger Fussball gucke als Wassersport, soll ich einen Fernseher kaufen, die einen Fussballspieler zeigt?

Dies ist ein gutes Beispiel dafür, warum es nicht immer gut ist, die Designs der grössten Websites zu kopieren. Weil Amazon ein unüberschaubar weites Produktspektrum überblicken muss, verwendet die Firma standardisierte Galerie-Layouts, die auf vielen verschiedenen Kategorieseiten funktionieren sollen und nicht für irgendeine einzelne Kategorie optimiert werden. Pottery Barn dagegen ist auf ein engeres Spektrum von Produkten hin optimiert, deshalb haben diese Kategorieseiten detailliertere Fotos.

Grosse Fotos = gut (wenn gewünscht)

Bei unseren Tests mit Produktseiten mit detaillierten Informationen über einzelne Produkte haben die Nutzer den Produktfotos noch mehr Aufmerksamkeit gewidmet. Die Leute mögen häufig alternative Blickwinkel und klicken Links an, um grössere Fotos herunterzuladen.

Ein Blick zurück ins Jahr 2005: Damals rangierten "unpassende Foto-Vergrösserungen" auf Platz 10 meiner Liste der 10 grössten Webdesign-Fehler. Damit ist gemeint: wenn die Nutzer den Link zu einem grösseren Foto anklicken und dann nur mit einem um 20% grösseren Foto belohnt werden. Es sollte wenigstens doppelt so gross sein, besser noch grösser. Leider wuchert dieser Fehler auch fünf Jahre später immer noch.

Ja, die Leute mögen keine grossen Fotos, die ihnen bei ihren Aufgaben im Weg stehen. (Das Beispiel Yale oben zeigt, was man nicht tun soll.) Aber wenn die Nutzer ein grösseres Foto anfordern, sieht die Sache anders aus:

Beachten Sie, dass dieses Detailfoto einer Frontplatte von ExtremeTech.com 12 Fixierungen auf sich gezogen hat. (Hier in 50% seiner Originalgrösse von 714 * 868 Pixel gezeigt.)

Bilder mit Informationsgehalt = gut

Das Gemeinsame an all diesen Beispielen (und tausenden mehr in unseren anderen Studien) ist, dass die Nutzer Bildern mit Informationsgehalt Aufmerksamkeit widmen, Bildern also, die Inhalte zeigen, die für ihre aktuelle Aufgabe relevant sind. Und die Nutzer ignorieren rein dekorative Bilder, die der Website keinen wirklichen Inhalt hinzufügen. Alles bloss Schaum - und davon gibt's doch schon genug im Internet.

Investieren Sie in gute Foto-Shootings: Ein hervorragender Fotograf kann dem geschäftlichen Wert Ihrer Website ein Vermögen hinzufügen.

 

© Deutsche Version von Jakob Nielsens Alertbox. Institut für Software-Ergonomie und Usability AG. Alle Rechte vorbehalten.