Gestaltgesetze

Vorbemerkung

Es gibt insgesamt über 100 Gestaltgesetze. An dieser Stelle werden nur die wichtigsten genannt, die für die Praxis der Gestaltung von Webseiten ebenso elementar sind wie das kleine Einmaleins in der Mathematik.

Die Beschreibungen sind auf das Wesentliche beschränkt. Ausführliche Informationen über Gestaltgesetze finden Sie unter den weiterführenden Links.

Wichtig zu beachten ist, dass die verschiedenen Gestaltgesetze zu-sammenwirken. Sie können sich ergänzen - mit positiver Wirkung -, sie können aber auch miteinander konkurrieren. Dann wird die Wahrnehmung irritiert und gestört. Ein Beispiel für konkurrierende Gestaltgesetze sehen Sie im Abschnitt Gesetz der Geschlossenheit.

Gesetz der Nähe

Die menschliche Wahrnehmung gruppiert Dinge, die räumlich nahe bei-einander liegen. Diese Dinge werden als zusammengehörig aufgefasst, also als Einheit wahrgenommen. Umgekehrt: Wenn Dinge weit voneinander entfernt sind, nehmen wir sie als getrennt und voneinander unabhängig wahr.

Hier sind zehn senkrechte Linien abgebildet. Sie werden jedoch wahr-scheinlich fünf schmale Säulen sehen. Dieser Eindruck wird durch Nähe erweckt. Die Abstände zwischen den Linien, die eine Säule bilden, sind so gering, dass sie von unserer Wahrnehmung gruppiert werden.
Damit dieser Effekt zustandekommt, müssen die Abstände zwischen den Säulen deutlich größer sein als die innerhalb der Säulen.

Welche Konsequenzen hat dies in der Praxis?
Bildschirminhalte, die sinngemäß zusammen gehören, müssen einerseits nahe beieinander stehen, andererseits deutlich entfernt von anderen Sinneinheiten. Leere (bzw. Abstand) ist also keine Platzvergeudung, sondern ein Gestaltungsmittel. Abstände helfen, Informationen sinnvoll zu ordnen und sie dadurch verständlich zu machen.

Gesetz der Geschlossenheit

Der Mensch nimmt geschlossene Formen als eigenständige Objekte wahr. Elemente, die sich innerhalb einer geschlossenen Form befinden, werden als zusammengehörig wahr genommen.

Hier sind die gleichen zehn senkrechten Linien abgebildet wie oben. Durch die Verbindung von je zwei weit auseinander stehenden Linien sind jedoch neue Einheiten entstanden, nämlich Rechtecke.
Dieses Bild macht auch die Wirkung deutlich, wenn das Gesetz der Nähe und das Gesetz der Geschlossenheit miteinander konkurrieren: Die Wahr-nehmung ist irritiert und gestört.

In diesem Bild sind alle weit auseinander stehenden Linien paarweise verbunden. Die beiden äußeren Linien wurden entfernt. Im Vergleich mit dem Bild darüber ist hier der optische Eindruck wesentlich ruhiger und angenehmer.

Welche Konsequenzen hat dies in der Praxis?
Zitat aus Kommdesign - Gestaltpsychologie:

Das Gesetz der Geschlossenheit ist ein sehr wichtiges Werkzeug, mit dem man Informationen ordnen, Zusammenhänge deutlich machen und die Orientierung erleichtern kann. Im Screen- und Webdesign spielt es deshalb eine grosse Rolle. Jeder Kasten, jede Tabellenzelle und jeder Button wird von unserer Wahrnehmung nach dem Gesetz der Geschlossenheit als Einheit erkannt. Umgekehrt gilt: Wenn Dinge, die zusammengehören, in unterschiedlichen Kästen platziert oder durch Trennlinien abgegrenzt sind, wird es den Benutzern fast unmöglich sein, sie gemeinsam zu beachten. Dies gilt auch dann, wenn möglicherweise die Distanz gering oder die Ähnlichkeit groß ist.

Gesetz der Ähnlichkeit

Die menschliche Wahrnehmung gruppiert Dinge, die sich ähnlich sind. Diese Dinge werden als zusammengehörig aufgefasst, also als Einheit wahrgenommen. Umgekehrt: Wenn Dinge sehr unterschiedlich aussehen, nehmen wir sie als getrennt und voneinander unabhängig wahr.

Das erste Bild zeigt eine Menge gleich aussehender Kreise. Durch die Gleichheit der Kreise empfinden wir sie als zusammengehörig. Wir nehmen also nicht jeden Kreis einzeln wahr, sondern wir sehen ein Feld mit einer Menge von Kreisen.

Im zweiten Bild werden Sie wahrscheinlich Säulen aus Kreisen bzw. Vierecken sehen. Die Ähnlichkeit der Kreise bzw. der Vierecke lässt diese als zusammengehörig wirken. Obwohl auch diese Symbole ein Feld bilden, nehmen wir dieses Feld nicht mehr wahr.

Hier ist das Bild mit den Säulen um 90 Grad gedreht. Nun nehmen wir keine Säulen mehr wahr, sondern Reihen aus Kreisen und Vierecken.
Beim zweiten und dritten Beispiel kommt auch das Gesetz der Einfachheit zum Tragen, nach dem Bilder so erkannt werden, dass sich möglichst einfache Strukturen ergeben.

Es spielt keine Rolle, worin die Ähnlichkeit der Objekte besteht. Es kann die Form, die Farbe, die Größe, die Helligkeit oder anderes sein. Selbst in der Akustik kommt das Gesetz der Ähnlichkeit zum Tragen: Töne ähnlicher Höhe, die rasch aufeinander folgen, werden von uns zusammengehörig gruppiert. Immer gilt: Je mehr Gemeinsamkeiten verschiedene Objekte haben, desto stärker neigen wir dazu, sie als Gruppe wahrzunehmen.

Es spielt ebenfalls keine Rolle, welche Entfernung zwischen ähnlichen Objekten liegt bzw. ob sie sich am selben Ort befinden. Z. B. werden unterstrichene Wörter auf Webseiten als Verweise wahrgenommen, unabhängig davon, in welchem Webangebot man sich befindet.

Welche Konsequenzen hat dies in der Praxis?
Das Gesetz der Ähnlichkeit kann unmittelbar auf das Design von grafischen Benutzeroberflächen übertragen werden: Elemente, die gleich aussehen und sich eindeutig von anderen Elementen unterscheiden, werden als zusammengehörig wahrgenommen. Daraus folgt zwingend: Elemente mit unterschiedlichem Verhalten dürfen keinesfalls identisch aussehen. Z. B. darf eine Schaltfläche, die eine Aktion auslöst, niemals so aussehen wie ein Verweis auf eine andere Webseite.

Gesetz der guten Fortsetzung

Die menschliche Wahrnehmung gruppiert Dinge, die auf einer durchgehenden Linie oder Kurve angeordnet sind. Diese Dinge werden als zusammengehörig aufgefasst, also als Einheit wahrgenommen.

Wenn das Auge einen Richtungsimpuls erhält, reagiert es instiktiv und setzt den Weg fort. Deshalb nehmen wir in dieser Grafik zwei sich kreuzende Kurven wahr. Eng verbunden mit dem Gesetz der guten Fortsetzung ist das Gesetz des glatten Verlaufs. Wir neigen dazu, Konturen mit sanften Übergängen fortzusetzen. Abknickungen oder Winkel widersprechen dieser Neigung.
Wir sehen die Linie von A nach B, weil sie glatter verläuft als die Linie
von A nach C.

Welche Konsequenzen hat dies in der Praxis?
Fluchtlinien sollen als Orientierungshilfen innerhalb von Texten eingesetzt werden. Sie können senkrecht angeordnet sein wie in einer Sitemap oder waagerecht wie bei Verweisen zum Blättern zwischen Seiten.
In Formularen ist das Einhalten von Fluchtlinien ein wesentlicher Beitrag zu einer ruhigen, übersichtlichen Optik.

Gesetz der Einfachheit

Dieses Gesetz wird auch »Gesetz der Prägnanz« oder »Gesetz der guten Gestalt« genannt. Es besagt, dass unsere Wahrnehmung Dinge so sieht, dass sie einfach erscheinen und leicht zu beschreiben sind.

In diesem Bild sehen Sie ein Dreieck und ein Rechteck, die sich über-lagern. Es wäre auch möglich, stattdessen ein abstraktes Polygon zu erkennen, aber irgendwie kommen wir nicht auf die Idee so zu sehen.
Es wäre zu umständlich.

Das Gesetz der Einfachheit macht besonders deutlich, worin der Kern
aller Gestaltgesetze besteht: Es ist Effizienz. Aus der möglicherweise unendlichen Anzahl an Interpretationen eines Reizes wird derjenige ausgewählt, den der Verstand am leichtesten handhaben kann.

Welche Konsequenzen hat dies in der Praxis?
Aus dem Gesetz der Einfachheit leitet sich die wichtige Empfehlung ab, Dinge möglichst einfach und eindeutig zu machen. Wahrnehmungsfreundliches Design folgt der KISS-Regel: »Keep it simple and stupid«. .

Gesetz der Symmetrie

Symmetrische Anordnungen ziehen die Aufmerksamkeit des Betrachters spürbar auf sich. Ein symmetrisches Design unterstützt demnach die klare Gliederung von Inhalten. Im Gegensatz dazu stört eine unausgewogene Aufteilung die Betrachtung und kann sogar zusätzlich zu einer kognitiven Belastung führen.

Die grünen Punkte sind symmetrisch angeordnet und deutlich im Vorder-grund zu sehen. Zwischen den roten Punkten fehlt der Bezug, zwischen ihnen springt unser Auge hilflos hin- und her. Die roten Punkte treten deshalb in den Hintergrund.

Welche Konsequenzen hat dies in der Praxis?
Eine symmetrische Anordnung erweckt den Eindruck von Ordnung und Ruhe, Asymmetrie vermittelt Innovation und Kreativität. Abhängig vom Inhalt eines Webangebotes kann das eine oder das andere angemessen sein. Wichtig ist, dass inhaltliche Botschaft und die Botschaft der Anordnung miteinander harmonisieren.

Gesetz der Verbundenheit

Dieses Gesetz besagt, dass Formen als Einheit wahrgenommen werden, die miteinander verbunden sind. Besonders interessant ist an diesem Gesetz, dass es in der Regel stärker wirkt als andere Gestaltgesetze und diese somit außer Kraft setzt.

A: Die Verbindungslinien wirken stärker als das Gesetz der Nähe.
B: Die Verbindungslinien wirken stärker als das Gesetz der Ähnlichkeit.

C, D: Die Verbindungslinien wirken stärker als die Gesetze der Nähe und der Ähnlichkeit.

Welche Konsequenzen hat dies in der Praxis?
Das Gesetz der Verbundenheit ist in den meisten Fällen die wirksamste Form der Gruppierung von Objekten. Eine Verbindungslinie zwischen zwei Objekten reicht oftmals aus, um einen festen Bezug zwischen ihnen herzustellen.

Gesetz der Bedeutung und Vertrautheit

Nach dem Gesetz der Vertrautheit bilden Dinge mit großer Wahrschein-lichkeit Gruppen, wenn wir dadurch etwas uns Vertrautes wahrnehmen.
Ob und wie wir ein Objekt erkennen, hängt jedoch auch davon ab, in welcher Umgebung sich das Objekt befindet.
Das Gehirn stützt sich dabei immer auf bereits gemachte Erfahrungen. Dieses Gesetz wird deshalb auch »Gesetz der Erfahrung« genannt.

Das Gemälde »Der Wald hat Augen« von Bev Dolittle zeigt auf Anhieb einen Reiter mit Packpferd in einem felsigen Waldstück. In diesem Bild sind jedoch auch 13 Gesichter versteckt. Sobald man die Gesichter erkannt hat, nimmt man vorrangig die Gesichter wahr und nicht mehr z. B. die Felsen, aus denen ein Gesicht besteht. Es fällt dann sogar richtig schwer, die Elemente, aus denen ein Gesicht besteht, noch als einzelne, unabhängige Objekte zu erkennen.

In diesem Bild wird dagegen deutlich, wie sich die Bedeutung eines Objektes ändern kann, wenn seine Umgebung verändert wird:

In der oberen Reihe (A) sind ein Quadrat und eine Raute abgebildet. Zeichnet man nun um jede Figur ein gekipptes Rechteck, wird aus dem Quadrat eine gekippte Raute und aus der Raute ein gekipptes Quadrat (Reihe B).

Welche Konsequenzen hat dies in der Praxis?
Die Wahrnehmung eines Objektes hängt in hohem Maß von dem Bezugsrahmen ab, in dem sich das Objekt befindet. Dies kann ebenso zu einer deutlicheren Darstellung wie auch zu Irritationen führen. Sie sollten es deshalb z. B. vermeiden, die gleichen Symbole in unterschiedlichen Umgebungen für verschiedene Einsatzzwecke zu verwenden.