Abstände im Webdesign

Heute wollte ich über Abstände sprechen. Und nicht die Körperabstände, sondern Anstände im Webdesign. Sehr oft werden sie vergessen oder falsch gesetzt, obwohl die als negativer Raum zu den wichtigsten Designelementen gehören. Es gibt ein paar ungeschriebene Gesetze, auf die man achten muss, um moderne, klar strukturierte Webseiten zu erstellen.

Zuerst was ich meine:
Äußerer Abstand: Bereich zwischen Überschrift und Section-Rand
Innerer Abstand: Bereich zwischen Überschrift und Untertitel / Zwischentitel / Elemente

Äußerer Abstand muss immer größer als innerer sein

So trennen wir verschiedene Webseiten Sectionen von einander und zeigen eine klare Hierarchie in Content-Blöcken. Und wie groß müssen sie sein? Eine ungefähre graphische Darstellung, wie eine Section mit richtigen Abständen aussieht:

Wichtiger Hinweis: Die Abstände gelten, wenn die Sectionen bereits von einander mit Farben oder Dividers getrent sind. Andernfalls werden sie vom letzten Element der oberen Section berechnet.

Diese Werte darf man natürlich nicht als letzte Wahrheit betrachten. Im Webdesign spielen Erfahrung und klarer Sinn eine entscheidende Rolle.