UX Design: Das Gesetz der Nähe

Im zweiten Teil unserer UX Design Prinzipien Reihe geht es um das der Nähe (Law of Proximity). Dieses Gesetz beruht auf unserer angeborenen Veranlagung, Muster auf der Grundlage bestimmter Regeln wahrzunehmen.

‍

Wenn Elemente mit geringen Abständen zusammenstehen, werden diese vom menschlichen Auge automatisch als zusammengehörig wahrgenommen. So kann das Gesetz der Nähe verwendet werden, um Strukturen und Felder zu schaffen. Bei Webseiten sollten zusammengehörende User Interface (UI) Elemente demnach möglichst Nahe beieinander stehen.

Dabei ist das Gesetz der Nähe ist eines der wichtigsten Gruppierungsprinzipien im UX Design und kann andere Prinzipien wie das Gesetz der Ähnlichkeit von Farbe oder Form überwältigen. In der Webdesign Praxis, sollten verwandte Elemente immer nahe beieinander platziert werden und nicht voneinander separiert sein. Die untere Darstellungen veranschaulicht die Gruppierung von einzelnen Elementen durch Nähe.

Die Verwendung unterschiedlicher Mengen an Leerraum (Whitespace), hilft zudem Elemente zu vereinen oder zu trennen. Dies ist der Schlüssel, um sinnvolle Gruppen zu vermitteln. So sehen wir auf dem unteren Bild im Kopfbereich der Webseite Notion, dass die Navigationsbar auf der linken Seite und das Login und call-to-actions (CTAs) auf der rechten Seite zwar auf der gleichen Höhe sind. Wir nehmen die Hauptnavigation auf der linken Seite dennoch getrennt wahr vom Login und den CTAs auf der rechten Seite. Der zusätzliche Leerraum weist darauf hin, dass die Gruppen nicht zusammengehörig sind und somit unterschiedliche Funktionen haben. Dieser Leerraum ist entscheidend dafür, dass sich der CTA und das Login vom Rest der Hauptnavigation abheben.

Die Nutzung dieses UX Prinzips zeigt sich auch bei der Darstellung einfacher Absätze. So werden Überschriften und Textinhalte zu Absätzen gruppiert, die oben und unten durch Leerraum getrennt sind. So ist der Text des entsprechenden Abschnitts in der Regel nahe bei der Überschrift platziert. Im Beispiel oben sehen wir direkt, wie das Statement “One workspace. Every team.” mit dem Untertitel zusammenhängt. Erst danach nimmt man den Call-to-action (CTA) in Form des Buttons wahr.

Wenn die Platzierung zusammengehöriger Elemente in Webseiten richtig gemacht wird, kann dies den Webseitenbesucher unterstützen sich schneller auf der Webseite zurechtzufinden und zu den relevanten Seiten zu navigieren. Dies erhöht die Benutzerfreundlichkeit, da der Nutzer die Funktionen einzelner Gruppen rasch und intuitiv herausfinden kann.

Wenn du mehr über die visuelle Wahrnehmung und ihre Anwendung im UX Design erfahren möchtest, dann bleib gespannt auf den nächsten Teil unserer UX Design Serie, der sich mit dem Gesetz der Prägnanz befassen wird.

‍