Image Image Image Image Image Image Image Image Image Image
Scroll to top

Top

Visuelle Wahrnehmung: Prinzipien der Gestaltpsychologie im Webdesign

Visuelle Wahrnehmung: Prinzipien der Gestaltpsychologie im Webdesign

Gestaltpsychologie entstand zu Anfang des vorigen Jahrhunderts auf Basis empirischer Wahrnehmungsforschungen. Die Versuche der deutschen  Psychologen – Max Wertheimer, Wolfgang Köhler und Kurt Koffka – machten  deutlich, dass unser Gehirn zur Vereinfachung und Strukturierung der aufgefassten visuellen Information tendiert.

werbung

Dabei stellte sich heraus, dass es nicht die Einzelteile eines Objektes sondern die einheitliche Gestalt wahrnimmt. Entdeckte Prinzipien bilden Grundlagen für visuelle Gestaltung und finden heute Anwendung in verschiedenen Bereichen. Besonders wichtig sind Gestaltgesetze fürs Webdesign, denn die Wirksamkeit einer Webseite hängt davon ab, wie deren Elemente von Besuchern erkannt werden. In diesem Beitrag versuchen wir einige Gestaltprinzipien anhand der Webvorlagen von TemplateMonster TemplateMonster zu illustrieren.

t13

Es gibt es keine wissenschaftlich eindeutige Definition von „Gestalt“. In jedem Bereich wird dieser Begriff verschiedenerweise erläutert. In der Psychologie wird als Gestalt die räumlich-visuelle Form der wahrgenommenen Gegenstände bezeichnet, deren Haupteigenschaft etwas anderes als die Summe ihrer Einzeleigenschaften ist. Um die Gestalt besser zu verdeutlichen, wäre es  sinnvoll, das Gesicht als Beispiel anzuführen. Abgesehen davon, dass alle Gesichter über gleiche Züge – Nase, Augen, Ohren, Lippen – verfügen, prägt das Gehirn Details als Ganzheit ein, indem eine einheitliche Gestalt entsteht, die mit einem konkreten Menschen assoziiert wird.

Gesetz der guten Gestalt (Einfachheit bzw. Prägnanz) wird als allgemeines Gesetz der Wahrnehmung von Objekten angesehen. Es besteht darin, dass so genannte „gute Gestalten“ – einfache Strukturen – vorzugsweise wahrgenommen werden. Sieht man komplexe Formen (Beispiele links), so werden sie instinktiv in eine Anzahl an einfachen Komponenten umgewandelt (Abbildungen rechts).

t1

Da elementare Formen weniger Zeit zum Erkennen brauchen, sorgt die  Vereinfachung dafür, dass man auf visuelle Eindrücke schneller reagieren kann. Möglichst einfaches und eindeutiges Webdesign, das mit Informationseinheiten nicht überladen ist, lässt sich auf der Webseite schnell orientieren und kann Handlungen der Besucher beeinflussen.

t2

Weitere Gestaltgesetze unterordnen sich dem Gesetz der guten Gestalt:  Teile werden vom Wahrnehmungssystem zu Gestalten verbunden, wobei das Zusammenfassen von visuellen Eindrücken durch prägnante Eigenschaften wie Einfachheit, Nähe, Geschlossenheit und andere erfolgt.

1) Gesetz von Figur und Grund

Dieses Gesetz verweist darauf, dass man auf jedem Gebilde zwischen Figur und Hintergrund unterscheiden kann. Beides gleichzeitig wahrzunehmen, ist nicht möglich. Das menschliche Auge ist in der Lage ein Objekt nur dann zu erkennen, wenn es sich von seinem Hintergrund abhebt. Das kleinere Objekt wird immer als Figur, der größere – als Hintergrund erkennbar. Nach außen gewölbte Elemente werden häufiger als Figuren, nach innen gewölbte – als Hintergrund erlebt. Allerdings hängt diese Zuordnung auch von der Ausführung ab. Verfügen die Figur und der Hintergrund über wenige Unterscheidungsmerkmale, so ist es schwer, sie eindeutig zu identifizieren. Dieses Gesetz lässt Inhalte priorisieren, wichtige Designelemente abgrenzen und auf der Webseite eine klare Hierarchie schaffen.

t3

t4

2) Gesetz der Gleichheit

Diesem Gesetz zufolge lassen sich ähnliche oder gleiche Objekte vom Gehirn zu einer Einheit bündeln. Haben zwei Designelemente die gleiche Form, Größe, Textur, Helligkeit, Kontrast oder Orientierung, werden sie miteinander assoziiert und derselben Gruppe zugeordnet.

t5

Im Webdesign wird dieses Prinzip eingesetzt, um die Einheitlichkeit zu erreichen. Elemente, die im gleichen Stil ausgeführt sind, verleihen dem Layout die Vollständigkeit und machen logische Zusammenhänge sofort sichtbar. Wiederholte Elemente gelten als bekannte Methode, die zur Benutzerfreundlichkeit beiträgt.

t6

3) Gesetz der Nähe

beschreibt die Wahrnehmung von Objekten, die räumlich nah zueinander liegen. So werden benachbarte Elemente optisch als zusammengehörig eingeordnet, auch wenn sie wesentliche Unterschiede zueinander haben. Die Nähe lässt sie nicht als einzelne Teile, sondern als logische Gruppen wahrnehmen. Anders gesagt, die gruppierten Elemente einer Webseite wirken wichtiger, als dieselben, die getrennt voneinander untergebracht sind. Ist der Abstand zwischen Elementen groß, werden sie als nicht zugehörig empfunden.

t10

Im Webdesign kommt das Gesetz der Nähe in der Gliederung und Strukturierung von Inhalten zum Einsatz. Um logische Verwirrung zwischen Abschnitten und Elementen einer Webseite zu vermeiden, hat man Titel, Beschreibungen und Links möglichst nah zu Elementen, auf die sie sich beziehen (Abbildungen, Textteile, Buttons, Überschriften) unterzubringen.

t9

Unter Gestaltgesetzen gilt das Gesetz der Nähe als eines der stärksten, deshalb braucht man es unbedingt zu berücksichtigen. Trotzdem muss man auch darauf Bedacht nehmen, dass es gegenüber dem Gesetz der Gleichheit verliert.

t11

4) Gesetz der Symmetrie

Nach dem Gesetz der Symmetrie werden Objekte, die symmetrisch um ein imaginäres Zentrum angeordnet sind, als einheitliche Gruppen verstanden. Diese lässt sich durch das unbewusste Streben nach Harmonie und Ordnung erklären. Je stärker die Symmetrie ausgedrückt ist, desto einfacher ist das Gebilde für das Wahrnehmen. Man unterscheidet drei Grundtypen von Symmetrie, die im Webdesign eingesetzt werden: Translationssymmetrie, Achsensymmetrie und Rotationssymmetrie.

t12

Verleiht die Symmetrie die visuelle Ordnung, kann die Asymmetrie die optische Wahrnehmung verzerren. Man hat die asymmetrischen Objekte im Webdesign vernünftig einzusetzen, denn sie können kognitive Belastung schaffen und die Aufmerksamkeit eines Besuchers von wichtigen  Designkomponenten ablenken.

5) Gesetz der Geschlossenheit

Nach dem Gesetz der Geschlossenheit werden in erster Linie Strukturen wahrgenommen, die eher geschlossen als offen wirken. Menschen bevorzugen einfache geschlossene Formen statt des leeren Raums wahrzunehmen. So werden unvollständige Objekte oder Gruppen vom Gehirn komplettiert, auch wenn ihre Fragmente fehlen.

t15

Das Gesetz der Geschlossenheit bietet breite Möglichkeiten für die Komposition im Webdesign. Geschlossene Formen kommen als eigenständige Objekte vor. Mehrere Objekte wirken zusammengehörig und werden als logische Gruppen verstanden.

t16

t17

6) Gesetz der gemeinsamen Region

Dieses Gestaltgesetz besagt, dass Flächen und Objekte, die mit Linien umschlossen sind, werden als Einheit empfunden. Elemente in abgegrenzten Gebieten werden als zusammengehörig erkannt. Die durch Linien getrennten Teile wirken als gemeinsam nicht.

t19

Das Gesetz der der gemeinsamen Region  ist ein sehr wichtiges Mittel, das Zusammenhänge bei vielen Informationen deutlich macht. Dank der Rahmen werden auch Buttons, Leisten oder Kästen als Einheit verstanden. Dieses Prinzip erlaubt die Informationen logisch und deutlich unterzubringen.

t20

7) Gesetz der Kontinuität

Beim Gestaltgesetz der Kontinuität werden Objekte, welche eine Fortsetzung vorheriger Elemente zu sein scheinen, als zusammenhängend wahrgenommen. Anders gesagt, man versteht einzelne Elemente, die entlang bekannter imaginären Formen angeordnet sind, als Einheit. Im Webdesign kann dieses Prinzip der Elementenanordnung nicht nur die Aufmerksamkeit fokussieren, sondern auch den Blick  der Besucher in bestimmter Richtung schweifen lassen.

t22

t23

Fazit

Im Ganzen genommen zählt man über hundert Gestaltgesetze. Sie alle können sowohl einander unterstützen als auch miteinander konkurrieren. Einige davon, die in diesem Artikel beleuchtet wurden, scheinen für jedermann bekannt zu sein. Doch alle Geheimnisse liegen im Einfachen: Gesetze funktionieren und ohne dieses fundamentales Wissen wäre es schwierig meist verbreitete „Sünden“ der Webdesigner zu vermeiden.