Vermeide Adobe Stock Bilder auf deiner Webseite – Guidelines zur UX optimierten Bildauswahl

Bilder werden heutzutage häufig zum ästhetischen Aufwerten der Seite verwendet. Besonders Adobe Stock Bilder haben einen hohen Verbreitungsgrad. Mit ihnen werden längere Textstrecken visuell aufgelockert. Und genau das ist aus Sicht der User Experience (UX) ganz schlecht; denn jedes Inhaltselement sollte nur auf einer Seite stehen wenn es dem Nutzer weiterhilft. Seiten, auf denen zu viel Text vorhanden sind werden durch auflockernde Bilder nicht besser. Dort sollte man lieber die Ursache des Problems angehen: den Text! Vielleicht muss man ihn kürzen oder es reicht einfach eine adequate Gliederung und Formatierung. Möglicherweise musst du deinen Text umschreiben. UX Writing kann dir in solchen Fällen weiterhelfen. Mit Adobe Stock Bilder und anderen Stock Assets, Fotos sowie Videos, kommt man dabei nicht weit.

Im übrigen geht es hier nicht nur um Adobe Stock Bilder (ehem. Fotolia), sondern generell um Fotos und Videos von Stock Plattformen, Bildagenturen und anderen Foto-Sharing Webseiten. Wieso diese Problematisch sind und wie man gute Bilder auswählt wird in diesem Artikel thematisiert! 

Das Problem mit Adobe Stock Bildern und Stock Assets anderer Unternehmen

Rein illustrative Fotos bringen Probleme mit sich: sie machen die Webseite verwechselbar / austauschbar. Die Beispiele in Abbildung 1 & 2 zeigen, dass die Fotos extrem unspezifisch sind und wenig mit dem Produkt / Betreiber zu tun haben; erst recht nichts mit den Interessen des Besuchers. 

Die Beispiele zeigen, dass selbst große / etablierte Unternehmen in die Bilder Falle treten. Sie benutzen wahrscheinlich keine Adobe Stock photos, sondern Bilder von Bildagenturen, die jedoch kein Deut besser sind!

Abbildung 1: Themen wie Geld, Vorsorge und Versicherungen sind nur schwer zu illustrieren. Seiten wie hier die Sparkasse versuchen es mit Fotos von glücklichen Personen. Sieht ganz hübsch aus, inhaltlich helfen diese Bilder jedoch überhaupt nicht weiter.

Abbildung 2: Selbst wenn es um physischere Dienstleistungen geht, werden keine passenden Bilder gezeigt. Vonovia setzt lieber auf schöne Fotos, die keine Informationen transportieren.

Auch wenn ein Bild von einer Stock Plattform wie beispielsweise Adobe sehr bequem zu verwenden ist, kann man aus Sicht der Originalität nur davon abraten. Wenn die Plattform dann noch kostenlos ist wird die Versuchung noch größer. Solch ein Bild kann niemals dein Produkt oder dein Unternehmen originell darstellen!

Vorteile von Bildern

Sobald Bilder Inhalte transportieren spielen sie ihre wahre Stärke aus, d.h. wenn sie...:

• Vorgänge abbilden
  
• Orte abbilden
• Produkte zeigen
• relevante Personen darstellen

Wenn dies gegeben ist, sind Bilder ein sehr wertvolles Medium für deine Seite!

 

Abbildung 3: Bei Stihl sieht man direkt um was es geht: Gartengeräte. Nicht so sexy wie attraktive Menschen, dafür aber unverwechselbar!

Bilder, insbesondere Fotos haben nämlich Vorteile, die reiner Text nicht bieten können:

• Sprechen den Nutzer direkt und emotional an
  
• Transportieren den Inhalt schnell und ohne Missverständnisse
• Bleiben besser im Gedächtnis als reiner Text 
• Bilder können geschickt die Aufmerksamkeit lenken. Beispielsweise Personen, die in eine bestimmte Richtung schauen animieren uns dort als erstes hinzuschauen

Das klingt natürlich sehr postitiv, jedoch haben zahlreiche Blickverfolgungsstudien (Eyetracking) gezeigt, dass Nutzer chronologisch nicht als erstes die Bilder einer Seite wahrnehmen. Dies liegt vermutlich daran, dass User im Laufe der Zeit gelernt haben, dass die Bilder überhaupt gar nicht den Sachverhalt darstellen. Besonders Bilder die nicht zum Thema passen schaden der Glaubwürdigkeit (mehr dazu im nächsten Abschnitt).

Nachteile von Bildern

Zahlreiche Blickverfolgungsstudien (Eyetracking) haben gezeigt: Nutzer ignorieren Bilder, die keine relevante Informationen enthalten und Webseiten einfach nur aufpeppen sollen. 

In Studien des amerikanischen Usability-Experten Jakob Nielsen haben die Probanden insgesamt nur 42% der Bilder angesehen; die meisten davon kürzer als eine Zehntelsekunde. Die Leute überfliegen also die Seite, nehmen ein Bild wahr und entscheiden intuitiv, dass es wahrscheinlich keinerlei Relevanz besitzt und somit sich nicht lohnt seine eigene Aufmerksamkeit darauf zu richten. Nochmal zur Wiederholung:

Lediglich 42% der Besucher schauen überhaupt auf die Bilder, die meisten davon jedoch kürzer als eine Zehntelsekunde. 

Abbildung 4: Blickverfolgungsstudien erzeugen eine Art Heat Map des Screens. Je „heißer“ der Bereich, desto öfters und länger schauen die Probanden auf den Bereich. Die Augenpartie der Probanden wird in einem Versuchsaufbau von einer Art Webcam gefilmt, eine Software rechnet dann mittels des Abstands zum Screen den Bereich aus, wo der Proband hinschaut.

Zudem kann ein einziges schlechtes Foto den gesamten Eindruck der Webseite ruinieren. Schlechte Bilder fallen wesentlich stärker auf wie beispielsweise schlechter Text. Schlechte Sätze werden meistens sowieso einfach überlesen oder unser Gehirn korrigiert Rechtschreibfehler und unzureichende Formulierungen ohnehin direkt beim lesen, sodass sie uns meist gar nicht auffallen. Störende Elemente im Bild bekommen wir jedoch sofort mit und machen uns stutzig.

Oftmals können Bilder sogar das Vertrauen in ihre Seite nachhaltig stören. Der Web-Content-Experte Gerry McGovern zitiert eine Untersuchung der Vermögensberater Fidelity Investment, in der Testpersonen Aussagen über den Ertrag einer Geldanlage als weniger glaubwürdig bewerten, wenn daneben ein Foto eines Menschen abgebildet ist. Die Testpersonen sahen sich die Seite zwar länger an, schenkten der Aussage jedoch weniger glauben. Ich wiederhole das nochmal, weil es so unglaublich wichtig ist:

User schenken einer Aussage weniger glauben wenn daneben ein unpassendes Foto eines oder mehreren Menschen ist. Dies gilt wenn die Person offensichtlich nichts mit der Aussage zu tun hat. Siehe dazu mein Beispiel in Abbildung 5!

Dieser Fakt zeigt, dass Bilder die Verweildauer der Besucher erhöhen, trotzdem jedoch schaden. Besonders im journalistischen Umfeld beeinträchtigen unspezifische Fotos von Bildagenturen oder Stock Plattformen sogar die generelle Glaubwürdigkeit. Mein Rat also: Finger weg von Stock Assets von Adobe, iStock, Deposit etc.

Abbildung 5: In vielen Blogs oder Magazin Seiten sind unspezifische Bilder vorherrschend. Auch vollkommen logisch, denn für viele Themen gibt es nunmal keine passenden Bilder. Was z.B. ein Kaffee mit HTML Editoren zu tun hat erschließt sich mir nicht. Das nächstbeste Bild von Unsplash.com macht euren Artikel nicht interessanter, @dr.web! 

Abbildung 6: Ebenfalls ein Blog, der jedoch ganz auf Bilder verzichtet. Seine Themen sind CSS und JavaScript (-> Code), zu denen es schlichtweg keine passenden Bilder gibt. Dann ist der vermeintlich drastische Schritt, Bilder einfach komplett rauszunehmen, gar nicht mehr so drastisch. Bravo bravissimo, @Zell.Liew!!!

Guidelines zur richtigen Bildauswahl

Damit deine Bildauswahl passend ist, müssen die Bilder folgende Aspekte erfüllen:

• scharf
  
• kontrastreich
• wenig detailliert; leicht zu erfassen
• konzentriert auf ein zentrales Motiv
• hochrelevant für den Inhalt

Es ist ein allgemeines Vorurteil, dass Usability-Experten Bilder generell ablehnen. Ebenso wenig wie die Behauptung, emotionale Bilder wären aus Usability Sicht ungünstig. Emotionale Bilder können die Nutzungsfreude (Joy of Use) verbessern.

Ein gutes Produktfoto kann hochemotional sein. Luxusgüter werden meistens hochemotional inszeniert. Man spricht dabei vom Hero Shot.

Auch ein glückliches Paar auf der Couch kann passen – vorausgesetzt es hat etwas mit dem Produkt zu tun. Nutzen beide beispielsweise ein Tablet, ist das als Illustration einer Webseite nicht schlecht, wenn diese Tablets verkaufen möchte.

Abbildung 7: Produktpräsentation bei Apple ist alles andere als sachlich und langweilig. Die Bilder sprechen den Betrachter im höchsten Maße emotional an.

Abbildung 8: Auch Menschen sind in Ordnung, wenn es dabei um das Produkt geht. Siehe Adidas.de!

Wie erkenne ich falsche Fotos

Unglaublich viele Bilder im Web, selbst von etablierten Unternehmen, entsprechen nicht der genannten Vorgaben aus dem letzten Abschnitt. Aber wie erkenne ich letztlich, dass ein Bild nicht geeignet ist?

Ein eindeutiges Indiz für ein schlechtes Foto ist, wenn es sich um ein Bild einer Bildagentur, einer Stock Plattform wie z.B. von Adobe oder einer Fotosharing-Website wie Flickr handelt. Diese Bilder sind generisch und passen mit ziemlicher Sicherheit nicht zu der Dienstleistung oder dem Produkt, welches du bewerben möchtest. Und selbst für den seltenen Fall, dass das Bild passen sollte, ist es trotzdem generisch, da man keine exklusiv Lizenzen erwerben kann. Das meint, dass viele andere dieses Bild besitzen und verwenden. Herausstechen tut man somit nicht, ganz im Gegenteil. 

Das ist besonders problematisch für Plattformen die kostenlos sind. Assets von beispielsweise Unsplash.com sind kostenlos, sollte man jedoch nicht verwenden da sie schlichtweg einen extrem hohen Verbreitungsgrad haben. Anmerkung: wenn man sich doch gegen alle Evidenz für „kostenlose“ Stock Bilder entscheidet, empfehle ich die Nutzungsbedingungen durchzulesen; oftmals ist kostenlos gar nicht so kostenlos.

Stock Bilder sind einfach alles andere als authentisch. Sie wirken gekünstelt und unecht. Manchmal müssen die Bilder auch einfach nicht perfekt sein, und vermeintliche Makel machen ein Bild authentisch und einzigartig!

Abbildung 9: „Wir hatten leider kein passendes Foto, aber irgendwas brauchen wir auf der Seite, sonst sieht man gleich, dass wir hier viel zu viel Text und keine Ideen haben, und so haben wir einfach ein hübsches Bild genommen.“

Ein weiteres ganz einfaches Anzeichen für überflüssige Fotos: Es geht keinerlei Inhalt für den Nutzer verloren, wenn man dieses Bild weglassen würde.

Manchmal ist es einfach besser die Bilder wegzulassen

Für viele Themen und Seiten lassen sich schlichtweg keine guten Bilder finden. Wenn man da an Sachen wir „Unsere Philosophie“ oder „Corporate Responsibility“ denkt, da stößt man schnell an die Grenzen. Wenn es keine passenden Fotos gibt sollte man darauf verzichten.

Die Seite wird nicht interessanter, das wurde bereits in unzähligen Nutzertests bewiesen. Deine Webseite sieht dann vielleicht besser aus, macht jedoch keinen besseren Eindruck. Mit dem Weglassen von inhaltslosen Stock Bildern kannst du deine Website erheblich verbessern. 

Abbildung 9 macht das gut deutlich, viele würden hier beim Thema Nachhaltigkeit eine grüne Wiese in den Hintergrund setzten. Absolut sinnfrei! Die Klinikgruppe Heiligenfeld hat das verstanden und macht diesen Fehler nicht!

Abbildung 9: Keine Bilder sind oftmals auch eine Lösung. Die Klinikgruppe Heiligenfeld konzentriert sich auf das, was Nutzer wissen wollen, die sich zu Nachhaltigkeit informieren wollen.

Sieht eine Seite schrecklich aus, dann ist sie es meist auch. Drückt euch nicht um die Überarbeitung des Inhalts, indem ein paar Fotos eingefügt werden!

Takeaway

Alle Evidenz zeigt: Stock Assets, d.h. Videos, Bilder und Vorlagen von Adobe und co. machen auf deiner Webseite schlichtweg keinen Sinn. Sie reduzieren die Glaubwürdigkeit und machen deine Seite und somit dein Unternehmen generisch und austauschbar. 

Wer die Adobe Creative Cloud abonniert hat, besitzt wahrscheinlich auch eine Stock subscription, in der er jeden Monat 10 Assets runterladen kann. Ich appelliere jedoch an euch: lasst es sein! Denn die Medien sind gar nicht so creative und einzigartig.

Ich empfehle einen Fotografen und dort das eine oder andere Photo schießen zu lassen. Oder falls ihr selber über Basiswissen beim Fotografieren verfügt macht es selber; die modernen Smartphonekameras sind mittlerweile so dermaßen gut dass die Qualität besser als von vielen günstigen Kameras sind.

Wenn es einfach keine passenden Bilder gibt und der Fotograf auch nicht weiterhelfen kann, lasst es sein! Konzentriert euch auf den Text. Vermeidet Wände aus Text, strukturiert ihn mit Listen, Tabellen und Absätzen. Investiert viele Gedanken in die Überschrift eurer Seite und eurer Texte. Diese sind extrem wichtig und entscheiden, ob der Content deiner Seite konsumiert wird.