Skip to main content

Abstände zwischen Layoutblöcken hinzufügen

Du bist hier:

Abstände im E-Mail-Design festlegen

Abstände im E-Mail-Design sorgen dafür, dass Inhalte klar gegliedert und leichter lesbar sind. In Mail Designer 365 kannst du einen Abstandsblock zwischen Layoutblöcken einsetzen oder den Abstand vor und nach einem Absatz direkt im Textbereich anpassen. Beide Methoden erfüllen unterschiedliche Aufgaben und lassen sich gezielt kombinieren.

Abstandsblock zwischen Layoutblöcken verwenden

Ein Abstandsblock trennt zwei eigenständige Bereiche deines Newsletters. Er eignet sich zum Beispiel zwischen Einleitung und Produktabschnitt, zwischen zwei Angeboten oder vor einem abschließenden Call-to-Action. Ziehe den Abstandsblock aus dem Inhalte-Bereich an die gewünschte Stelle und passe anschließend seine Höhe an.

Verwende wiederkehrende Abstände, um einen ruhigen visuellen Rhythmus zu schaffen. Wenn vergleichbare Abschnitte jeweils unterschiedlich viel Platz erhalten, wirkt das Design schnell unruhig. Prüfe die Wirkung sowohl in der Desktop- als auch in der mobilen Vorschau, da derselbe Abstand auf einem schmalen Bildschirm stärker auffallen kann.

Wenn du noch ein wenig Abstand zwischen deinen Layoutblöcken brauchst, um das Design übersichtlicher zu machen, brauchst du einen Abstandsblock.

Abstandsblock für Abstände im E-Mail-Design

Ziehe den Block aus dem Inhalte-Fenster zwischen zwei Layoutblöcken:

Abstandsblock zwischen Layoutblöcke ziehen

Du kannst nun die Höhe des Abstands verändern, indem du den Block größer oder kleiner ziehst.

Höhe eines Abstandsblocks anpassen

Du kannst außerdem Abstand vor oder nach einem Textblock hinzufügen. Wähle dazu einen Textbereich aus. Im Stil-Menü findest du die Einstellungen „Vor dem Absatz“ und „Nach dem Absatz“. Erhöhe oder verringere die Punktwerte, um den gewünschten Absatzabstand festzulegen.

 

 Abstand vor und nach einem Absatz einstellen

 

Zeilenabstand und Absatzabstand unterscheiden

Der Abstand zwischen Layoutblöcken ist nicht dasselbe wie der Zeilenabstand innerhalb eines Textes. Für den Raum vor oder nach einem Absatz wählst du den Textbereich aus und passt im Stil-Menü die Werte „Vor dem Absatz“ beziehungsweise „Nach dem Absatz“ an. So kannst du Überschriften, Absätze und Listen innerhalb desselben Textblocks klar voneinander trennen.

Ein zu kleiner Abstand erschwert das Erfassen der Inhalte. Ein zu großer Abstand kann dagegen den Zusammenhang zwischen Überschrift und Text auflösen. Beginne mit moderaten Werten und beurteile das Ergebnis im gesamten Layout statt nur im ausgewählten Textbereich.

Abstände für mobile Newsletter prüfen

Auf einem Smartphone werden Layoutblöcke häufig untereinander dargestellt. Dadurch kann sich die Gesamthöhe des Newsletters deutlich vergrößern. Prüfe daher, ob große Abstandsblöcke mobil noch sinnvoll sind und ob wichtige Inhalte ohne langes Scrollen erreichbar bleiben. Passe bei Bedarf die mobile Version an, ohne die inhaltliche Reihenfolge zu verändern.

Achte außerdem auf die Nähe zu klickbaren Elementen. Zwischen zwei Buttons oder Links sollte genug Platz liegen, damit sie bequem mit dem Finger bedient werden können. Gleichzeitig sollte klar bleiben, welcher Text zu welchem Button gehört.

Einheitliches Abstandssystem aufbauen

Lege für dein Design wenige wiederkehrende Abstandsstufen fest, zum Beispiel klein für zusammengehörige Texte, mittel zwischen Elementen eines Abschnitts und groß zwischen eigenständigen Themen. Dieses einfache System erleichtert spätere Änderungen und sorgt dafür, dass neue Layoutblöcke zum bestehenden Newsletter passen.

Setze Abstand bewusst statt als Ersatz für eine klare Struktur ein. Überschriften, Absätze, Farben und Layoutblöcke sollten die Hierarchie gemeinsam vermitteln. Wenn ein Abschnitt nur durch sehr große Leerflächen verständlich wird, lohnt sich oft eine Überprüfung der eigentlichen Anordnung.

Checkliste für saubere Abstände

  • Ähnliche Abschnitte verwenden ähnliche Abstandswerte.
  • Überschrift und zugehöriger Text bleiben optisch verbunden.
  • Buttons und Links lassen sich mobil sicher antippen.
  • Desktop- und Mobilvorschau wurden geprüft.
  • Der Newsletter bleibt trotz Weißraum kompakt und übersichtlich.

Weitere Hinweise zu Layoutblöcken und mobilen Textstilen findest du im Mail Designer 365 Handbuch.

FAQs coming soon

Privacy Settings / Datenschutz-Einstellungen