WebDesign-Blog von Uli Thiel

Visuelle Elemente, EYE Tracking

Ein Bild sagt mehr als 1000 Worte – den Satz kennen Sie (Unsere Vorfahren malten Bilder an die Höhlenwände, Text kam erst viel später dazu).

Wir sind noch immer spezialisiert auf Bilder aus unserer Entwicklungsgeschichte – wir nehmen intuitiv und kognitiv wahr. Intuitives Erfassen von Inhalten geht schneller als kognitives Erfassen, Sie wissen: die beiden Gehirnhälften – Bilder werden in der rechten Hirnhälfte verarbeitet und Texte in der linken – das ist in etwa vergleichbar mit ISDN und Modem-Leitung- ISDN vor allem wenn Sie auf beiden Leitungen Informationen zuleiten zum Gehirn.

Menschen wollen visuelle Informationen haben (seit dem Höhlenzeitalter) – je jünger die Menschen sind, desto mehr sind sie (wieder) mit visuellen Inhalten aufgewachsen seit wir im Medienzeitalter sind. Handy-MTV-Videospiele-Xbox etc.

Internet-Nutzer entscheiden sich binnen 3 Sekunden (laut Studien) ob sie sich auf einer Website umsehen wollen oder sofort weiter klicken.

In dieser kurzen Zeit schafft eine Website/ WebDesign es nicht durch kognitive Elemente (Texte) eine positive Entscheidung herbei zu führen. Um auf der intuitiven Ebene Kontakt aufzunehmen, benutzt gutes WebDesign visuelle Elemente, zum Beispiel atmosphärische Bildinhalte. Diese werden an der richtigen Stelle platziert, fesseln den Blick. Das Bauchgefühl wird durch die Atmosphäre der Bilder angesprochen.

In meinen Vorträgen analysiere ich an dieser Stelle die Blickführung der User, indem ich auf Overlays Raster zeige wie visuelle Elemente auf populären Websites platziert und hierarchisiert sind.

Bei der Planung von Inhalten und Gestaltungsraster (WebDesign) für Firmenwebsites bedenke ich – neben der Textmenge und Density von Keywords – den hohen Kommunikationswert der Bildinhalte.

Wenn Sie ein Redaktionssystem für Ihre Website verwenden und die künftigen Bildinhalte nicht immer kontrollieren können (z.B. weil die Bilder und Texte aus Agenturen wie z. B. DPA geliefert werden nach Aktualität und automatisch) , dann wird es immer auch Zufallstreffer geben oder Kontext entsteht, der eine gewisse Freiheit haben wird. Bedenken Sie das bei der Planung.

Styleguide für die Emotionalisierung von Corporate Imagery: Legen Sie einen Styleguide für Bildinhalte fest. Am Beispiel der BMW-Website ist einfach nachzuvollziehen was das sein kann.
Die Bilder sind einheitlich in Hinblick auf folgende Merkmale:

1. Sämtliche Bilder haben eine bestimmte Perspektive zu eigen, von links unten nach rechts oben.
2. Hell-Dunkel Kontrast (mittlere Helligkeit bis sehr hell )
   
3. Sättigung (grau blau überwiegt, es gibt sehr selten grelle Farben, welche die helle Atmosphäre stören)
   
4. Teaser-Architektur mit bis zu 3 verschiedenen Bildgrößen

Durch die helle Bildwelt mit konstanten Bildinhalten im Umfeld von weissem Hintergrund wird eine Atmosphäre von Freundlichkeit, Konsequenz, Orientierung, Sauberkeit und Perfektion erzeugt.