Mail-Templates erstellen

float:left; margin 1%; ? Fehlanzeige!
Webdesign Anno 1999: Tabellen in Tabellen. Die alten Haudegen dürfen wieder Templates gestalten. ;-)

Es kann sein, dass dein Mail-Client wundersam moderne Dinge wie ein margin richtig darstellt. Aber: Es gibt ungefähr soviele Mail-Clients wie du Newsletter versendest.

Wenn du halbwegs sicher sein willst, dass dein Newsletter überall vernünftig ankommt, musst du in die HTML 2 Trickkiste greifen und Tabellen verwenden.

Vermeide colspan und rowspan, greife lieber zu verschachtelten Tabellen. Aber: nicht zu tief verschachtelt, schon die 3. Ebene kann Probleme machen.

Alles was moderner als HTML 2 ist, kann funktionieren – oder auch zerfallen. Halte den Ball flach.

CSS:

Externes CSS funktioniert nur in Ausnahmefällen, und das auch nur, wenn das Nachladen externer Dateien erlaubt ist. Versuche, alles Nötige im <style>Tag im <head> unterzubringen.

Farben und Schriftgrößen für HTML-Elemente (h1, h2.. a, a:hover usw) funktionieren meistens. Seltener, aber noch oft: einfache classes und ids, verlasse dich aber nicht darauf.

Float wird häufig ignoriert – greife hier eher zu Layout-Tabellen.

Responsives Design

Wenn dein Newsletter schon einfach gestrickt sein soll, kannst du dich nicht darauf verlassen, dass media queries erkannt und umgesetzt werden.

Denke daran, dass es auch eine Web-Version deines Newsletter geben kann – und diese wird meist dort angesehen, wo dein Newsletter zerfleddert angekommen ist.

Die Webversion IST dein Newsletter, nur eben in einem modernen Browser angesehen. Das bedeutet: Hier kannst du korrigierend eingreifen.

Denke daran, dass innerhalb von Tabellen max-width nicht funktioniert.

Bilder

Die sofortige Darstellung von Bildern ist häufig ausgeschaltet und muss erst aktiviert werden.

Bedenke: Nur wenn die Attribute width und height gesetzt sind, wird der Platz korrekt freigehalten. Gibst du nur width an (wie bei responsiven Templates üblich), ist der freigehaltene Platz quadratisch. Das kann bei Header-Bildern oder anderen breiten Bildern fatal aussehen.

Module anzapfen

Text-Bild Kombinationen wirst du im Editor nicht vernünftig händeln können. Für diesen Fall ist das Newsletter-Template Latest-Topics beigelegt. Auch wenn du mit Topics nicht so vertraut bist: Es ist das einfachste und Topics ist von Haus aus im Lieferumfang dabei. Das Template setzt die Grundeinstellungen voraus.

In der index.php des Templates kannst du natürlich nicht nur Topics „anzapfen“ - das geht analog auch mit anderen Modulen. Hier wird es aber keine Fertig-Lösungen geben, weil das zu individuell ist. Du kannst dir ansehen, wie das mit Topics gelöst wurde und selbst die Hand an PHP legen.
Oder frage einfach im Forum, du wirst geholfen werden ;-)

Zurück