> For the complete documentation index, see [llms.txt](https://one-loop.gitbook.io/help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://one-loop.gitbook.io/help/plattform/one-loop-plattform/kommunikation/e-mail/rahmen-in-e-mail-layouts-gestalten.md).

# Rahmen in E-Mail-Layouts gestalten

## Was du mit einem Rahmen steuerst

Ein Rahmen hebt einen zusammengehörenden Bereich deiner E-Mail optisch hervor – zum Beispiel eine Terminübersicht, einen Gutschein oder einen Hinweis. Du steuerst dabei Farbe, Stärke und die Rundung der Ecken.

Die Einstellung gehört zu einem **Layoutbereich**. Ein Layoutbereich ist der umgebende Abschnitt, in dem mehrere Inhalte wie Text, Bild oder Schaltfläche liegen können. Sie steht nicht für jedes einzelne Inhaltselement zur Verfügung.

## Bevor du beginnst

Entscheide zuerst, was der Rahmen erreichen soll:

* **Leicht abgrenzen:** eine dünne, zurückhaltende Linie.
* **Etwas hervorheben:** eine deutlichere Farbe oder mehr Abstand zum Inhalt.
* **Als Karte wirken lassen:** leicht abgerundete Ecken und ein dezenter Rahmen.

Verwende Rahmen sparsam. Wenn viele Bereiche gleichzeitig stark umrandet sind, wird die E-Mail unruhig und wichtige Inhalte sind schlechter erkennbar.

## Rahmen Schritt für Schritt einstellen

1. Öffne die E-Mail im visuellen Editor.
2. Klicke auf den **Layoutbereich**, nicht direkt auf Text, Bild oder Schaltfläche.
3. Im linken Bearbeitungsbereich öffnet sich **Rahmeneinstellungen**.
4. Wähle bei **Rahmenfarbe** eine Farbe über den Farbwähler oder gib einen Hex-Wert ein, zum Beispiel `#E5E7EB`.
5. Stelle bei **Eckenrundung** über den Regler oder ein Zahlenfeld ein, wie weich die Ecken wirken sollen.
6. Bestimme bei **Rahmenstärke** über Regler oder Zahlenfeld, wie breit die Linie sein soll.
7. Wenn nötig, bearbeite einzelne Seiten des Rahmens getrennt.
8. Prüfe die Änderung direkt im Editor.
9. Klicke auf **Save**, damit sie übernommen wird.

## Die einzelnen Einstellungen verstehen

| Einstellung        | Wirkung                                                        | Gute Entscheidung für den Start                                                 |
| ------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------- |
| **Rahmenfarbe**    | Bestimmt die sichtbare Farbe der Linie.                        | Nutze eine dezente Farbe, die ausreichend Kontrast zum Hintergrund hat.         |
| **Eckenrundung**   | Bestimmt, ob Ecken kantig oder weich gerundet aussehen.        | Verwende eine kleine Rundung, wenn der Bereich wie eine Karte wirken soll.      |
| **Rahmenstärke**   | Bestimmt, wie präsent der Rahmen ist.                          | Beginne dünn und erhöhe nur, wenn die Abgrenzung nicht erkennbar ist.           |
| **Einzelne Seite** | Erlaubt unterschiedliche Werte oben, rechts, unten oder links. | Nutze das nur mit einem klaren Gestaltungsgrund, etwa für eine Trennlinie oben. |

Die Vorschau im Editor zeigt die Änderung sofort. Sie ersetzt aber nicht den Testversand: E-Mail-Programme können Inhalte unterschiedlich darstellen.

## Einzelne Seiten bewusst nutzen

Ein Rahmen muss nicht auf allen vier Seiten gleich sein. Eine praktische Anwendung ist eine Linie nur oberhalb eines Abschnitts, um zwei Themen sauber zu trennen.

Gehe dabei schrittweise vor:

1. Stelle zunächst einen einheitlichen Rahmen ein.
2. Öffne die Einstellung für eine einzelne Seite.
3. Passe nur die Seite an, die du wirklich ändern möchtest.
4. Prüfe die Wirkung im Editor und in einer Test-E-Mail.

Vermeide unterschiedliche Farben oder Stärken auf jeder Seite, wenn sie keinen klaren Zweck haben. Das wirkt schnell wie ein Darstellungsfehler.

## Vorschau, Mobilansicht und Test

Die Rahmeneinstellungen passen sich automatisch an verschiedene Bildschirmgrößen an. Prüfe trotzdem immer:

1. die Vorschau im Editor;
2. die mobile Ansicht;
3. eine Test-E-Mail in einem echten Postfach.

Achte darauf, ob Text genug Abstand zum Rahmen hat, die Farbe noch gut lesbar ist und der Bereich nicht wichtiger wirkt als die eigentliche Botschaft.

## Typische Probleme

* **Rahmeneinstellungen fehlen:** Du hast wahrscheinlich ein einzelnes Element statt des umgebenden Layoutbereichs ausgewählt.
* **Der Rahmen wirkt zu dominant:** Verringere zuerst die Stärke, bevor du die Farbe stark änderst.
* **Der Rahmen ist auf Mobilgeräten unruhig:** Reduziere die Stärke und kontrolliere den Innenabstand des Layoutbereichs.
* **Die Änderung ist nach dem Verlassen nicht sichtbar:** Speichere den Entwurf über **Save** und prüfe die Vorschau erneut.

> **Praxisbeispiel:** Ein Studio möchte die Terminübersicht in einer E-Mail klar vom übrigen Inhalt trennen. Das Team wählt den Layoutbereich um die Übersicht, setzt eine dünne hellgraue Linie und eine kleine Eckenrundung. Anschließend testet es die E-Mail auf Mobilgerät und Desktop. Weil der Bereich gut lesbar bleibt, speichert das Team die Vorlage für weitere Nachrichten.