In diesem Artikel listen wir verschiedene Hinweise zur Templateprogrammierung auf.
Sie brauchen diese nur wenn Sie eine komplett eigene Vorlage
- Die Breite der E-Mail sollte sich zwischen 600 und 700 Pixel befinden. Die CleverReach-Vorlagen sind für die Breite 600 Pixel optimal ausgelegt.
- Gestalten Sie die E-Mail so, dass diese auch ohne Bilder gelesen werden kann, falls die Bilder von den E-Mail-Clients geblockt bzw. nicht heruntergeladen werden sollten.
- Geben Sie allen Bildern eine feste Breite (WIDTH) und Höhe (HEIGHT).
- Verwenden Sie keine Hintergrundgrafiken. Einige E-Mail-Clients (wie z. B. Outlook 2007) haben Probleme mit dem Anzeigen dieser Grafiken.
Technische Hinweise
- Verwenden Sie keine Div-Layer, sondern Tabellen (CleverReach- und Drag & Drop-Vorlagen ausgenommen). Auf keinen Fall sollten Sie absolut positionierte Div-Layer verwenden.
- Wenn CSS-Styles verwendet werden, dann sollten diese möglichst inline gehalten werden. Outlook 2007 und 2010 beispielsweise können nur begrenzt CSS-Styles interpretieren, die im Head deklariert werden. Grundsätzlich sollte aber weitestgehend auf CSS-Styles verzichtet werden, besonders Klassen- und ID-Selektoren (CleverReach-Vorlagen ausgenommen). Auf keinen Fall sollten externe CSS-Dateien eingebunden werden.
- Breitenangaben einer Tabelle (WIDTH) müssen im 'TD' stehen und nicht in Table. Zusätzlich sollten Sie die Breitenangaben direkt im TD-Attribut definieren, nicht als CSS-Style.
- Vermeiden Sie die Nutzung von rowspan innerhalb von Tabellen, arbeiten Sie hierbei mit verschachtelten Tabellen.
- Platzieren Sie Bilder möglichst nicht mit float. Besonders Inline-Styles mit float werden z. B. von Outlook 2007 und 2010 komplett ignoriert.
- Verwenden Sie den Inline-Style display:block, wenn Sie in Ihren Templates Bilder aneinanderreihen möchten (somit werden fehlerhafte Leerstellen im Layout verhindert).
- Nutzen Sie zur Höhenangabe keine %-Angaben, besonders nicht bei Bildern (responsive Vorlagen ausgenommen).
- Halten Sie Linkbezeichnungen kurz, da sich sonst die Breite der Tabelle / Zelle der Linkbezeichnung automatisch anpasst.
- Verwenden Sie unter keinen Umständen Konvertierungsprogramme, welche aus Grafik-Dateien HTML-Dokumente erstellen. Der generierte HTML-Code wird bei vielen E-Mail-Clients Layoutprobleme verursachen.
- Verwendete Dateinamen von Bildern sollten eine einfache Bezeichnung haben. Namen wie "bild_1900_x_1600.jpg" können bei einigen E-Mail-Programmen fehlerhaft oder gar nicht dargestellt werden. Auch sollten Sie hier auf Leerzeichen verzichten und die Bilderbezeichnungen ausschließlich mit Klein-Buchstaben versehen (z. B. logo.jpg).
- Hinterlegen Sie in der Vorlage keinen <title> Tag. Dieser wird durch das System automatisch beim Versand durch den Betreff gesetzt.
- Verzichten Sie auf die Nutzung von animierten Grafiken (z. B. Roll-Over-Funktion oder animierte Gif-Dateien). Outlook z. B. unterstützt diese Funktion generell nicht.
Kommentare