Mai 2003 > mehr wissen > Visuelle Wahrnehmung von Webseiten
 
Visuelle Wahrnehmung von Webseiten
Von Kira Song
 

Im März 2003 widmete sich der AK Webdesign des FIWM zusammen mit der Veranstaltungsreihe Netzblicke dem Thema Usability. Oliver Diekamp (Ref. Internet und Virtuelle Hochschule der LMU) referierte über seine Studie „Visuelle Wahrnehmung von Webseiten“, in deren Rahmen er übrigens das „Mouse-Tracking-Verfahren“ entwickelte.

Die Ergebnisse seiner Studie helfen Webdesignern, sich bei der Gestaltung näher an der Zielgruppe zu orientieren. Welche Objekte bekommen die meiste Aufmerksamkeit, inwieweit bestimmt die Seitengestaltung die Bewertung einer Webseite? Die Antworten dieser Fragen helfen, einen Wahrnehmungsverlauf in der Gestaltung vorzugeben.


Bildelemente sind Hingucker
Die Wahrscheinlichkeit, dass ein vorhandenes Bildelement als Erstes beachtet wird, liegt bei 26%. Mit einigem Abstand folgen dann Hyperlinks mit 8%, die Navigationsleiste mit 7%, Banner mit 3% und Text mit 1%. Wohl bedingt durch Browsernavigation und –menü liegt durchschnittlich der erste visuelle Seiteneinstiegspunkt im oberen linken Bereich einer Webseite. 41% aller Besucher beachten diesen Bereich als Erstes. Befindet sich in oder um diesen Seiteneinstiegspunkt ein Foto mit einem Gesicht, wird dies mit einiger Sicherheit vor allen anderen Elementen wahrgenommen. Diese erste Fixation ist jedoch nur von sehr kurzer Dauer.


Navigationselemente sind am Wichtigsten
Es überrascht uns nicht, dass die Navigation einer Seite durchschnittlich am meisten Beachtung findet – schließlich müssen die Besucher sich erst mal zurecht finden, um an ihre Information zu gelangen. Von der gesamten Betrachtungszeit entfallen im Durchschnitt 78% auf die Beachtung der Navigationsobjekte. Hyperlinks werden zu 9%, Bildobjekte nun nur noch zu 4%, Textobjekte zu 5% und Banner zu 2% beachtet.


Was wichtig ist muss nach oben
Den ersten zwei Fünftel der Webseite werden 73% Aufmerksamkeit geschenkt. Dabei ist die horizontale Position nicht unbedingt von Bedeutung. Die mittleren und unteren Bereiche hingegen werden lediglich zu ca. 25% beachtet. Für selbstverständlich dürfte uns erscheinen, dass Inhalt, der ohne zu scrollen ersichtlich ist, mehr Beachtung geschenkt wird als verdecktem Inhalt.


Weniger ist mehr
Stark mit Bild und Text überladene Webseiten verwirren die Benutzer, da sie sich schwerer tun, wichtige Information optisch von unwichtiger zu unterscheiden. Schlank gestaltete Webseiten wurden in der Studie generell höher bewertet, mit Bildern und Text vollgeladene Webseiten schnitten hingegen schlechter ab.


Frauen sehen anders
Einer Studie der Firma MediaAnalyzer Software & Research GmbH zufolge legen Männer und Frauen bei der Betrachtung von Webseiten unterschiedliche Wahrnehmungsmuster an den Tag. Während Männer mehr auf Bildmaterial schauen, achten Frauen eher auf Textelemente. Frauen beachten auch Navigationselemente und Menüs stärker im Gegensatz zu Männern.


Was passiert mit Bannern?
Obwohl Werbebanner an den optimalen Stellen platziert werden, bekommen sie im Verhältnis sehr wenig Beachtung. Begründet wird dies durch die sogenannte „Banner Blindness“: Die Nutzer haben sehr schnell gelernt, bestimmte Banner-Gestaltungsmuster sofort zu erkennen - durch die Lage auf der Seite, Größe und typische Erscheinung (Animation). Da ein Nutzer nicht wegen der Werbebanner auf eine Webseite kommt, reagiert das Auge zum Teil gar nicht mehr auf den Reiz. Somit filtert der Nutzer den Banner automatisch aus.


Fazit
Wichtige Information sollte möglichst weit oben auf der Seite platziert werden. Ein Firmenlogo oder die Seitennavigation wird im oberen linken Bereich als Erstes wahrgenommen, was im Sinne des Betreibers nützlich sein dürfte. Allerdings sollte diese Tatsache uns nicht entmutigen, auch für unkonventionelle Lösungen offen zu sein. Man kann sich durchaus mit neuen Wegen der Seitenaufteilung befassen. Hauptsache ist, dass sich der Besucher durch eine kluge Benutzerführung leicht zurechtfindet. Dann kann man durchaus auch mal den „Standardweg“ verlassen.


Grundregeln zur Webseiten-Erstellung:

  • Eine gründliche Planung sowie eine gut durchdachte Strukturierung und Inhalte sind die Basis einer erfolgreichen Webseite;
  • erstellen Sie ein Raster für die Webseite und richten Sie alle Elemente fix daran aus;
  • wichtige, sich auf jeder Seite wiederholende Elemente sollten immer an gleicher Stelle zu finden sein (z.B. Logo, Navigation);
  • wichtige Informationen gehören in den oberen Bildschirmbereich;
  • mit animierten Bildern & Texten sparsam umgehen;
  • den Fließtext mit ca. 50-70 Zeichen pro Zeile darstellen;
  • nicht mehr als 3 Schriftgrade verwenden;
  • für Textdarstellung genügend Kontrast zum Hintergrund verwenden, möglichst keine Komplementärfarben aufeinander;
  • nicht zu bunt: ein charakteristisches Farbklima als Identifikationsmerkmal verwenden (im Sinne des Corporate Design).

Die Liste ließe sich noch sehr lange fortführen. In der Infobox rechts finden Sie weiterführende Links zum Thema sowie Quellenangaben, die allemal einen Klick wert sind.

Links zu Usability

Umfangreiche Linksammlung
zum Thema Usability (englisch):
www.usableweb.com

Thema Usability bei Dr. Web
www.drweb.de

www.usability-forum.com

www.usability-test.net


About Web Design:
"Der Wow-Effekt"


Quellen

PPT-Präsentation der Studie
von Oliver Diekamp
bei Netzblicke:
www.netzblicke.net

MediaAnalyzer
Bericht bei w&v online:
www.wuv.de

Website von Karin Büchner
zu den Themen Text und Farbe im Internet:
www.k-buechner.de


Autorin
Kira Song
Kontakt: kira.song@mediella.de