Das Auge klickt mit – Warum Bilder im Internet nicht nur Dekoration sind

Ein Bild sagt mehr als tausend Worte
Dieses alte Sprichwort bewahrheitet sich auch heute noch immer wieder. Denn Bilder sind nicht nur schön anzusehen, sondern tragen in den meisten Fällen auch Emotionen und eine gewisse Botschaft in sich. Allerdings ist hier Vorsicht geboten: Bilder haben auf Menschen ganz verschiedene Wirkungen.

Während dieses Bild dem einen Betrachter vermittelt, dass hier schwer gearbeitet wird und ein großes Projekt entsteht, fühlt sich ein anderer Betrachter vielleicht im Chaos der sich stapelnden Blätter verloren. Dieser Effekt kann durch die fehlende Farbe des Bildes sogar noch verstärkt werden. Wie aber kann man diesem Problem entgegentreten? Durch Tests mit Personen, die der Zielgruppe sehr ähnlich sind, kann das beste Bild gefunden werden.
Allerdings gibt es auch einige wissenschaftliche Grundsätze, die bei einer ersten Vorauswahl der Bilder sehr hilfreich sein können. Wir möchten diese Tools kurz vorstellen.
Die Sache mit der Zielgruppe
Natürlich muss man sich bei der Auswahl der geeigneten Bilder zuerst im Klaren sein, welche Zielgruppe angesprochen – und welches Ziel erfüllt werden soll. Sind diese definiert, kann bei der weiteren Auswahl die Psychologie helfen. Die Grundbedürfnisse der Zielgruppe oder auch eines jeden Menschen hat Abraham Maslow in der so genannten Bedürfnispyramide zusammengefasst.

Dabei sind physiologische Bedürfnisse (Funktionalität) und Sicherheit in der Regel durch die Plattform selbst abgedeckt. Bild- und Textelemente sollten daher soziale und individuelle Bedürfnisse abdecken und die entsprechenden Emotions- und Belohnungszentren im Gehirn ansprechen. Wie findet man aber jetzt die richtige Emotionalität?
Auf den richtigen Kontext kommt es an
Stockfotos machen es vor: Unterschiedliche Motive und Models finden für so viele verschiedene Kampagnen und Botschaften Verwendung, dass sich die Emotionen bei Wiedererkennung vermischen. Man kennt es ja: Gestern sieht man die hübsche schwarzhaarige Frau im rosafarbenen Pullover noch für eine Dating-Plattform werben, am nächsten Tag erstrahlt ihr Gesicht auf der Anzeige einer Fußpilz-Creme. Zwei vollkommen unterschiedliche Marken mit unterschiedlichen Aussagen, aber dennoch dasselbe Motiv. Neben dem Bild selbst muss also auch der Kontext die richtige Emotion vermitteln und zusammen mit der Bildsprache eine Einheit bilden.

Neben Vitalbedürfnissen wie Schlaf, Nahrung und Atmung sind menschliche Emotionen in drei Hauptfelder, die so genannten „Big 3“ einzuteilen. Zur Vereinfachung und Erweiterung dieses Systems wurden die Typen in der „Limbic® Map“ zusammengefasst und in Relation gestellt. Der Kontext bestimmt dabei in welche Richtung es geht. Eine Website für einen Erlebnispark bewegt sich also im Stimulanz-Bereich, indem Spaß, Abenteuer und Neugier erwartet werden, während sich die Website einer Anwaltskanzlei eigentlich nur im Sicherheit, Qualität und Verlässlichkeit ausstrahlenden Balance-System bewegen kann.

Ganz klar: Für einen IT-Dienstleister, der moderne Technologien verspricht und für Qualität und Sicherheit stehen sollte, passt eine alte Schreibmaschine und ein Notizbuch nicht.

Für ein Hostel, das sich primär an junge Gäste richtet, die aufs Land möchten, kann sich der scheinbare Ausschluss der Bild-Text-Kombination als Witz und damit Spaß-förderndes Element herausstellen.
Der Kontext gibt also die Richtung vor, allerdings sind Bilder im modernen Webdesign das erste Element, das wir wahrnehmen. Design, Text und Bild ergeben also im Idealfall eine Einheit und strahlen alle gemeinsam eine unverwechselbare Emotion bzw. Botschaft aus, die durch den Nutzer unmissverständlich klar aufgefasst wird.
Fazit
Bilder im Internet müssen das Bedürfnis nach Emotionalität erfüllen, das von der Website selbst nur selten abgefangen wird. Dabei kommt es vor allem darauf an, welche Emotion vermittelt werden soll und wie diese dann letztendlich beim Nutzer ankommt. Bei der Auswahl und Einbindung der Bilder können zwar wissenschaftliche Grundlagen eine Stütze sein, letztendlich bieten aber nur Tests mit möglichst vielen Personen eine Klarheit darüber, wie diese Emotion aufgenommen wird.
Wie Bilder und Icons neben Emotionsvermittlung auch die Aufgabe der Benutzerführung einnehmen können, erfahren Sie in Teil 2 unserer Beitragsserie: Das Auge klickt mit – Visuelle Benutzerführung durch Bilder und Icons.
Weiterführende Links & Quellen
1. Bedürfnispyramide von Maslow: https://de.wikipedia.org/
2. Limbic Types / Limbic Map der Gruppe Nymphenburg: www.nymphenburg.de
3. Der Einfluss von Hero Images auf die Generation Y: t3n.me/generation-y-eyetracking
Beratung anfragen
Wählen Sie einen Termin für ein 30-minütiges Erstgespräch.
Kontakt aufnehmen
Schreiben Sie uns kurz, worum es geht.
Formular wird geladen …
Danke!
Ihre Nachricht ist angekommen. Wir melden uns in Kürze bei Ihnen.
Hierarchie
Wir gewichten Inhalte über Größe, Position und Kontrast, sodass das Wichtigste sofort führt. Ihr Besucher findet sich zurecht, ohne zu suchen, und der nächste Schritt liegt immer nahe. Das senkt Absprünge und entlastet Ihren Vertrieb.
Konsistenz
Buttons, Abstände und Begriffe folgen einem festen System über alle Seiten hinweg. Neue Inhalte fügen sich automatisch ein, die Pflege bleibt einfach und wirkt nach außen verlässlich. So entsteht ein Auftritt, der zusammengehört.
Marke auf dem Schirm
Farben, Typografie und Bildsprache übersetzen Ihre Marke in eine Oberfläche, die man wiedererkennt. Gestaltung und Funktion greifen ineinander, statt sich zu behindern. Das Ergebnis trägt Ihre Identität und bleibt zugleich zugänglich.
Orientierung
Navigation, Einstiege und Seitenstruktur führen Besucher gezielt zum passenden Angebot. Sie erkennen schnell, ob sie richtig sind, und verlieren keine Zeit. Das erhöht die Chance, dass aus Interesse ein Lead wird.
Verständlichkeit
Wir bereiten Produkte, Leistungen und Optionen so auf, dass sie ohne Rückfrage einzuordnen sind. Komplexe Angebote werden vergleichbar, Hürden auf dem Weg zum Lead fallen weg. So qualifiziert sich Ihr Interessent selbst vor.
Vertrauen
Klare Sprache, nachvollziehbare Struktur und sichtbare Belege geben Sicherheit. Gerade in längeren B2B-Entscheidungen mit mehreren Beteiligten zählt das. Ihre Website überzeugt damit auch jene, die später dazukommen.
Stabilität
Geprüfte Updates, Monitoring und feste Abläufe halten die Plattform sicher und verfügbar. Probleme werden behoben, bevor sie für Sie sichtbar werden. So läuft Ihre Website im Hintergrund verlässlich weiter.
Skalierbarkeit
Die Architektur ist auf Wachstum ausgelegt. Weitere Inhalte, Sprachen, Marken oder Standorte lassen sich ergänzen, ohne neu zu beginnen. Strukturen ziehen mit, statt zu bremsen.
Wartbarkeit
Saubere Strukturen und dokumentierte Erweiterungen machen die Pflege planbar. Auch ein neues Team versteht das System schnell und arbeitet sicher weiter. Das hält die laufenden Kosten überschaubar.
Kontakt aufnehmen
Erzählen Sie uns kurz, worum es bei Ihrer Oberfläche geht. Wir melden uns mit einer ersten Einschätzung.
Formular wird geladen …
Danke!
Ihre Nachricht ist angekommen. Wir melden uns in Kürze bei Ihnen.
Kontakt aufnehmen
Sagen Sie uns kurz, wo es in der Nutzerführung hakt. Wir melden uns mit einem konkreten nächsten Schritt.
Formular wird geladen …
Danke!
Ihre Nachricht ist angekommen. Wir melden uns in Kürze bei Ihnen.
Kontakt aufnehmen
Beschreiben Sie kurz Ihr TYPO3-Anliegen. Wir melden uns mit einer Ersteinschätzung.
Formular wird geladen …
Danke!
Ihre Nachricht ist angekommen. Wir melden uns in Kürze bei Ihnen.
Beratung anfragen
Wählen Sie einen Termin.
Beratung anfragen
Wählen Sie einen Termin.
Beratung anfragen
Wählen Sie einen Termin.
Kontakt aufnehmen
Sagen Sie uns kurz, worum es bei Ihrem Webprojekt geht. Wir melden uns mit einer ersten Einschätzung.
Formular wird geladen …
Danke!
Ihre Nachricht ist angekommen. Wir melden uns in Kürze bei Ihnen.
Beratung anfragen
Wählen Sie einen Termin für ein Erstgespräch.
Stabilität
Geprüfte Updates, Monitoring und feste Abläufe halten Ihre Website sicher und verfügbar. Probleme werden behoben, bevor sie für Sie sichtbar werden.
Skalierbarkeit
Die Architektur ist auf Wachstum ausgelegt: weitere Inhalte, Sprachen oder Standorte lassen sich ergänzen, ohne neu zu beginnen.
Wartbarkeit
Saubere Strukturen und dokumentierte Umsetzung machen die Pflege planbar. Auch ein neues Team versteht das System schnell.
UX Interface Audit
Das Audit liefert eine priorisierte Liste von Verbesserungen für zentrale Seiten und Module.
Hilfreich, wenn zentrale Seiten inkonsistent sind oder Hürden enthalten und Vertrauen und Orientierung leiden.
UX-Optimierungs-Check
Der Check zeigt, wo Orientierung, Formulare und Leads unnötig schwer werden.
Hilfreich, wenn Nutzer den Weg zum Lead nicht finden oder Formulare bremsen.
Informationsarchitektur-Sprint
Der Sprint ordnet Struktur, Navigation und Pflege, bevor ein Relaunch startet.
Sinnvoll, wenn Navigation und Seitenbaum gewachsen sind und wichtige Seiten unsichtbar bleiben.
TYPO3 Health Check
Der Check liefert eine klare Prioritätenliste zu Ladezeiten, Sicherheit, Barrierefreiheit und Sichtbarkeit.
Hilfreich, wenn Performance, Sicherheit und Wartbarkeit gleichzeitig wackeln und die Reihenfolge fehlt.