HTML-E-Mail-Vorlage-Generator

Viele E-Mail-Client-Systeme – insbesondere Microsoft Outlook auf Windows – verwenden das Word-Engine, das nur sehr begrenzte CSS-Unterstützung bietet und Flexbox, Grid und die meisten Positionierungsregeln ignoriert. Verkettete HTML-Tabellen bleiben die einzige Layout-Struktur, die konsistent in allen Client-Systemen, einschließlich Gmail, Outlook, Apple Mail, Yahoo und mobiler Webmail, angezeigt wird. Deshalb sieht produzierte E-Mail-HTML wie Web-Code aus dem Jahr 2003 aus: es ist das niedrigste gemeinsame Nenner, das alle Rendering-Engines überlebt.

MSO-Bedingungen sind HTML-Kommentare, die nur Microsoft Outlook (Word-Engine) interpretiert. Sie sehen aus wie <!--[if mso]> ... <![endif]--> und ermöglichen es Ihnen, Markup oder Stile speziell für Outlook zu versenden, ohne andere Clients zu beeinflussen. Sie werden häufig verwendet, um eine feste Containerbreite mit einer Phantom-Tabelle zu definieren, VML für Buttons und Hintergründe zu beheben und Funktionen zu deaktivieren, die Outlook falsch darstellt. Ohne sie verformen oder verzerren sich Layouts oft in Outlook, selbst wenn sie überall sonst perfekt aussehen.

Viele wichtige E-Mail-Client-Systeme – historisch besonders Gmail – entfernen <style> Blöcke oder behandeln sie sie ungleich, besonders auf Mobilgeräten und bei weitergeleiteten Nachrichten. Das Inlinesystem verschiebt jede Regel direkt auf das Element, das sie betrifft, über das style Attribut, das jeder Client respektiert. Der Preis dafür ist eine höhere Verfassung und schwerere Wartung, weshalb Tools – einschließlich dieses Generators – existieren, um CSS-Regeln automatisch inline zu machen, ausgehend von einer höherstufigen Vorlage.

Der Vorabtext ist ein kurzer Textabschnitt, der nach dem Betreff in der meisten Postfachvorschauen angezeigt wird. Standardmäßig wird er aus dem ersten sichtbaren Text im E-Mail-Körper abgerufen, was oft eine Begrüßung oder eine Standardtexte ist, die den Platz verschwenden. Durch die Einführung eines versteckten Vorabtext-Elements am Anfang des HTML-Dateis wird Ihnen ermöglicht, genau zu bestimmen, was dort angezeigt wird. Ein gut formulierter Vorabtext ergänzt den Betreff und ist in den meisten A/B-Tests, die von großen ESPs durchgeführt werden, mit höheren Öffnungsquoten korreliert.