Abstände im Webdesign

Heute möchte ich über Abstände sprechen - und zwar nicht die körperlichen Distanzen, sondern die Abstände im Webdesign. Oft werden sie vernachlässigt oder falsch gesetzt, obwohl die als negativer Raum zu den wichtigsten Designelementen gehören. Es gibt einige unausgesprochene Regeln, auf die man achten sollte, um moderne, klar strukturierte Webseiten zu gestalten.

Zuerst möchte ich erklären, was ich mit "Außenrand" und "Innenabstand" meine:
Der Außenrand bezieht sich auf den Bereich zwischen der Überschrift und dem Section-Rand oben und unten.
Der Innenabstand hingegen bezeichnet den Bereich zwischen der Überschrift und einem Untertitel oder einem anderen Element innerhalb der Section.

Um verschiedene Abschnitte einer Webseite voneinander abzugrenzen und eine klare Hierarchie in den Inhaltsblöcken zu schaffen, gibt es eine einfache Regel:

Außenabstände müssen grundsätzlich größer als Innenabstände innerhalb einer Section sein.

Aber inwieweit groß? Diese grafische Darstellung zeigt, wie eine Section mit den richtigen Abständen aussehen könnte.

abstände im webdesign

Dabei ist zu beachten: Diese Abstände gelten, wenn die Sectionen bereits durch Farben oder Trennlinien voneinander getrennt sind. Andernfalls werden sie vom letzten Element der oberen Section berechnet.

Es ist wichtig zu betonen, dass diese Werte nicht als unumstößliche Wahrheit angesehen werden sollten. Im Webdesign spielen Erfahrung und ein klares Verständnis eine entscheidende Rolle.

23.04.2021