Gleich vorweg: Dies ist ein rein theoretischer Beitrag, da ich meine E-Mails in Thunderbird in plain-ASCII lese.
Was ist beim Erstellen von E-Mails in HTML zu beachten?
Einige Gewohnheiten, welche bei der Erstellung von Webseiten selbstverständlich und ratsam sind, sollten bei der Erstellung von HTML-EMails vermieden werden:
- Viele E-Mail-Clients unterdrücken das Nachladen von Inhalten, um ein tracken der Nachricht zu verhindern. Wenn sie nun CSS-Beschreibungen in einem externen Stylesheet auslagern (was bei Webseiten Standard ist), so wird dieses nicht eingebunden. Alle CSS-Anweisungen sollten daher IN der E-Mail definiert werden.
- Animierte GIFs werden von manchen Clients dargestellt, andere zeigen nur das erste Bild. Stellen sie daher sicher, daß im ersten Bild eines animierten GIFs die Hauptaussage des Bildes zu sehen ist.
- web.de filtert bei der Darstellung die !important-Anweisung aus CSS-Befehlen, was zu Darstellungsfehlern führen kann. Ansonsten stellen die Online-Clients von web.de und gmx.de die dargestellten Mails in einem IFrame da, was eine gute Darstellung sicher stellt.
- Wollen sie in den E-Mails überwiegend technikaffine Empfänger (wie z.B. mich) ansprechen, so sollten sie eine Plain/Text-Version von der E-Mail anbieten. Gerade in diesem Umfeld wird die HTML-Darstellung ausgeschaltet.
- Immer mehr Mail-Clients blockieren externe Grafiken. Darum sollte ihre Mail auch ohne Grafiken sinnvoll dargestellt werden. Besonders ärgerlich wenn wichtige CallToActions-Buttons (CTA) in der E-Mail durch Grafiken dargestellt werden.
- Auch wenn es wie vor 10 Jahren klingt: Nutzen sie Tabellen! Der Grund ist seltsamer als es viele vermuten werden: Microsoft Outlook stellt E-Mails nicht mit der Render-Engine vom Explorer oder Edge dar … sondern von Word! Selbst in der neuesten Version Outlook 2016 steckt im Hintergrund Word dahinter, welches CSS und HTML sehr notdürftig unterstützt. Vertraute Dinge wie padding, margin, width, height, Hintergrundfarben, floats ergeben ofmals seltsame Resultate. Aufgrund der Verbreitung von Microsoft Outlook im geschäftlichen Bereich sollten sie bei dieser Zielgruppe auf ein tabellenbasiertes Layout zurückgreifen.
- Achten sie auf eine Darstellung auf allen Gerätetypen. Mittlerweile werden mehr als 50% der E-Mails auf Smartphones gelesen. Schlecht daran ist, dass nicht alle Clients media-queries unterstützen. Achten sie darum z.B. auf ausreichend große Schrift, Abstände und große Buttons, die touch-optimiert sind.