Website-Gestaltung: 4 psychologische Prinzipien, die ihr kennen solltet
Fakt: Das Design erfolgreicher Websites beruht auf wissenschaftlichen Erkenntnissen – nicht auf subjektiv-kreativen Bauchgefühlen. Ebenfalls Fakt: User*innen surfen flüchtig im Web. Umso wichtiger ist es, dass euer Webdesign für die menschliche Wahrnehmung optimiert ist. Vier entsprechende Prinzipien der User-Experience (UX, "Nutzungserlebnis") zeige ich euch in diesem Beitrag.
Folgende vier psychologischen Grundsätze der Website-Gestaltung schauen wir uns detailliert an:
- Kurzzeitgedächtnis-Kapazitäten berücksichtigen
- Gestaltgesetze beachten
- Banner-Blindheit einkalkulieren
- Blickverlaufsmodelle kennen
Auf geht's:
1. Webseiten-Elemente: Kurzzeitgedächtnis-Kapazitäten berücksichtigen
Das Miller'sche Gesetz hört auch auf den Namen 7±2 Regel: Der US-Psychologe George A. Miller erkannte bereits 1956, dass unser Kurzzeitgedächtnis am besten sieben (plus/minus zwei) Informationseinheiten speichern kann: also mindestens 5 und höchstens 9.
2024 sieht die Forschung das laut der deutschen UX-Expert*innen Jens Jacobsen und Lorena Meyer etwas flexibler: Auch die Art der Information und der Kontext beeinflussen, wie viel Informationseinheiten unser Oberstübchen auf einmal wuppen kann.
Dennoch solltet ihr euch bei der Website-Gestaltung an der 7±2 Regel orientieren – zum Beispiel, wenn es um die Anzahl von Navigationspunkten geht.
Anders sieht es aus, wenn ihr Preismodelle auf euren Webseiten nennt: Hier sind laut Jacobsen und Meyer bereits fünf Optionen die absolute Obergrenze.
Obergrenzen solltet ihr bei der Website-Gestaltug immer beachten: Laut dem
Hick'schen Gesetz (benannt nach dem britischen Psychologen William
Edmund Hick) wünschen sich Menschen auf der bewussten Ebene zwar eine große
Auswahl, sind in der Praxis aber schnell damit überfordert. Deshalb: Weniger
ist mehr.
2. Website-Usability: Gestaltgesetze beachten
Evolutionär musste unser Gehirn lernen, sich best- und schnellstmöglich zu orientieren, um unser Überleben zu sichern. Das beeinflusste unsere Wahrnehmung, aus der sich wiederum folgende Gestaltgesetze ableiten. Diese solltet ihr auch bei der Website-Gestaltung berücksichtigen:
➤ Gesetz der Nähe: Dinge, die sich auf einer Webseite nah beieinander befinden, empfinden User*innen als zusammengehörig.
➤ Gesetz der Ähnlichkeit: Dieses Gesetz wirkt stärker als das der Nähe. Elemente auf einer Webseite, die gleichfarbig und/oder gleichförmig sind, empfinden wir als zusammengehörig – auch wenn sie sich nicht in unmittelbarer Nähe zueinander befinden.
➤ Gesetz der Symmetrie: Der Begriff "symmetrisch" bedeutet "ebenmäßig", "in gleichförmiger Anordnung stehend", "ausgewogen" oder "spiegelgleich". Das Gestaltgesetz der Symmetrie ist ebenfalls stärker als das der Nähe. Website-Elemente, die sich symmetrisch verhalten, nehmen User*innen eher wahr als solche Inhalte, die unstrukturiert wirken.
➤ Gesetz der Einfachheit: User*innen nehmen vorrangig Gestaltungen wahr, die einfach bzw. einprägsam sind.
➤ Gesetz der Geschlossenheit: Website-Besucher*innen nehmen bevorzugt
Strukturen wahr, die geschlossen wirken.
3. Website-UX: Banner-Blindheit einkalkulieren
Laut UX-Studien nehmen viele User*innen Werbebanner auf Webseiten nicht wahr. Eine Theorie besagt: Sie haben unbewusst gelernt, dass es sich um Inhalte handelt, die nichts mit dem eigentlichen Content der Webseite zu tun haben.
Die UX-Expert*innen Jacobsen und Meyer betonen: Auch, wenn es keine Werbebanner auf eurer Website gibt, müsst ihr dieses Problem berücksichtigen. Es reicht schon, dass User*innen ein Element eurer Webseite für Werbung halten, um dieses zu ignorieren.
Beispiele sind Slider-Shows auf der Startseite oder automatisch ablaufende
Videos: UX-Expert*innen raten von ihnen ab, da User*innen sie für Werbung
halten könnten (und folglich nicht beachten oder gar als störend
empfinden).
4. Blickverläufe auf Webseiten: Z- und F-Muster
Blickverlauf-Modelle untersuchen, welchen Weg die Augen von Website-Besucher*innen auf einer Seite gehen. Diese Modelle sind relevant für die Frage, wo auf einer Seite ihr wichtige Inhalte platzieren solltet.
➤ Das Gutenberg-Diagramm (benannt nach dem Erfinder des Buchdrucks Johannes Gutenberg) wird auch Z-Muster genannt. Es besagt: Menschen, die von links nach rechts lesen, starten oben links auf einer Webseite. Hier liegt ihre höchste Aufmerksamkeit.
Von links oben wandert der Blick weiter über die Seite in Form eines Z:
- oben von links nach rechts,
- dann schräg nach links unten,
- und unten wieder von links nach rechts.
Empfohlen wird eine inhaltliche Ausrichtung anhand des Z-Musters für Landingpages mit geringer informationeller Dichte und einer klaren Handlungsaufforderung (Call-to-Action).
Offen bleibt die Frage, ob dieser Blickverlauf auch für die mobile Darstellung auf einem schmalen Smartphone-Bildschirm gilt.
➤ Das F-Muster geht zurück auf den dänischen UX-Pionier Jakob
Nielsen. Es bezieht sich vorrangig auf Webseiten mit viel Text. Demnach
scannen User*innen entsprechende Webseiten in Form des Buchstaben F: Sie lesen
die Hauptüberschrift einer Webseite, dann die ersten Worte des ersten
Absatzes, dann die erste Zwischenüberschrift, um dann die Seite "schmal" nach
unten zu scannen.
Website-UX: Empirische Fakten statt subjektives Bauchgefühl
Geht es in Unternehmen um die Neugestaltung der eigenen Website, so kann ich euch aus meiner Berufserfahrung sagen: Es artet häufig aus in "kreative Bauchgefühl-Eskapaden".
Der eine Kollege hat "da mal so einen schicken Online-Auftritt gesehen", die andere Kollegin berichtet, ihr habe "Website XY ja schon immer gut gefallen" – und die Geschäftsführung kommt schlimmstenfalls mit gänzlich grotesken Wünschen um die Ecke ("Das soll so aussehen wie bei Mitbewerber XY, die machen mehr Umsatz als wir").
Immer bedenken: Website-UX fußt auf empirischen Erkenntnissen. Sie ist eine wissenschaftlich fundierte Online-Marketing-Disziplin. Oberstes Ziel muss immer sein, dass eure Zielgruppe mit eurem Online-Auftritt zurechtkommt und dort die gewünschte Conversion durchführt (Kauf, Download, Kontaktaufnahme, Anmeldung, etc.).
Deshalb: Stellt sicher, dass eure Website-Gestaltung immer objektiven Erkenntnissen folgt und ihr mit Vertreter*innen eurer Zielgruppe ausgiebige User-Tests fahrt.
Viel Erfolg!
Quelle:
- Jens Jacobsen, Lorena Meyer: Praxisbuch Usability und UX
Link-Tipps:
Kommentare