Wissenswertes zur E-Mail-Darstellung in Microsoft Outlook

Wer sich einmal mit der Erstellung eines komplexen Newsletters beschäftigt, der auch in Microsoft Outlook gut aussehen soll, merkt schnell, dass dies gar nicht so einfach ist. 

Statt der gewünschten Schriftart wird Times News Roman angezeigt, Abstände sind verschoben, Schattierungen und Abrundungen werden überhaupt nicht angezeigt, und moderne HTML-Elemente wie DIVs sehen auch irgendwie „komisch“ aus. Woran liegt das?

Microsoft Outlook macht E-Mail Marketern das Leben schwer. Und das seit Einführung von Microsoft Outlook 2002 Service Pack 3 – also seit über 20 Jahren!

Woran liegt das?

In grauer Vorzeit hat Outlook die Engine vom Internet Explorer genutzt, um E-Mails anzuzeigen. Damals hatte man fast völlige Freiheit in der Gestaltung seiner E-Mails – sogar integrierte Formulare und Skript waren möglich – und gefährlich!

Seit Microsoft Outlook 2002 Service Pack 3 wird nicht mehr der Internet Explorer für die Darstellung genutzt. Stattdessen wird die E-Mails in eine Art Word-Dokument umgewandelt. Und bei dieser Umwandlung geht vieles verloren. Outlook unterstützt in der Tat nur eine kleine Auswahl von HTML-Befehlen, die deutlich älter sind als der heutigen Standard HTML5/CSS3.

Eine offizielle Dokumentation zu den von Microsoft Outlook unterstützen Elementen gab es zuletzt 2006 (!). Es besteht Hoffnung, dass uns die neuen auf Outlook.com basierten Versionen mehr Freiheit gewähren. Da aber häufig noch alte Versionen von Microsoft Outlook im Einsatz sind, werden wir mit der Problematik noch einige Jahre leben müssen. 

CSS3-Klassen

Microsoft Outlook unterstützt grundsätzlich keine CSS-Klassen. Sämtliche Styles müssen als Inline-Styles definiert werden, wenn sie berücksichtigt werden sollen. 

Schattierungen und Abrundungen werden von Microsoft Outlook grundsätzlich ignoriert und lassen sich höchstens als V-Shape realisieren. 

DIV-Elemente

Während die meisten modernen Webseiten auf DIV-Strukturen basieren, akzeptiert Microsoft Outlook hauptsächlich Tabellen zur Strukturierung eines Newsletters. 

Innenabstände in DIVs werden beispielsweise nur dann berücksichtigt, wenn es an der entsprechenden Seite einen Rand mit einer Breite von mindestens 1px gibt.

Unser System nutzt DIVs bei der Erstellung von E-Mails, bettet sie aber in sogenannte Schatten-Tabellen ein, die nur in Microsoft Outlook angezeigt werden.

Außenabstände

Außenabstände werden von Microsoft Outlook nicht sinnvoll unterstützt. Deswegen arbeitet unsere Software grundsätzlich nur mit Innenabständen und Abstandhaltern. 

Innenabstände in mehrspaltigen Tabellen

Ein weiteres Problem ergibt sich, wenn man eine mehrspaltige Tabelle hat, bei der die oberen Innenabstände variieren. Microsoft Outlook wird in diesem Fall in allen Spalten den Innenabstand der ersten Spalte geben. Die einzige Möglichkeit, unterschiedliche obere Innenabstände zu realisieren, besteht darin, für den Abstand ein Abstand-Halter Element zu verwenden.

Der Rand einer Tabelle wird nur dann berücksichtigt, wenn in der entsprechenden Zelle ein Rand definiert ist.

Soll kein Rand angezeigt werden, so muss dies explizit mit der Eigenschaft „none“ angegeben werden, sonst wird ein dünner grauer Rand angezeigt.

Fonts / Fallback-Schriftarten

Microsoft Outlook unterstützt nur Schriftarten, die auf dem System der Empfängerin installiert sind. Ist eine Schriftart nicht installiert, wird grundsätzlich Times New Roman als Schriftart verwendet – egal, ob man einen Fallback-Font angegeben hat oder nicht.  

Ein Nachladen von Fonts – z.B. Google Fonts – wird von Microsoft Outlook nicht unterstützt.

Auch die Schriftgrößen und Zeilenabstände können variieren. Das liegt an der Konvertierung von HTML-Code in ein Word-Dokument zur Anzeige der E-Mail. 

Aufzählungen

Bei unsortierten Aufzählungen in Texten werden von Microsoft Outlook ausschließlich Punkte unterstützt. Eigene Grafiken werden ignoriert oder durch Punkte ersetzt.

Zufällig verteilte dünne Linien

Manchmal werden in Outlook zufällig verteilte dünne horizontale Linien in grau angezeigt. Dies liegt an einem Fehler in der Grafikengine von Outlook, teilweise werden diese Linien auf jedem Computer anders angezeigt. 

Formulare, Buttons und Skripte

Microsoft Outlook unterstützt aus Gründen der Sicherheit weder Formulare noch Buttons oder Skripte. Das ist auch richtig so, weil all dies Einfallstore für Viren und Schadware sein können. 

Bildformate, Hintergrundgrafiken & Videos

Unterstützte Bildformate sind .bmp, .gif, .jpg, .jpeg, und .png. Andere Formate wie Vektorgrafiken im .svg Format werden nicht unterstützt. 

Hintergrundgrafiken in DIVs, Tabellen oder Zellen werden in Microsoft Outlook nicht angezeigt. 

Videos werden in Microsoft Outlook grundsätzlich nicht angezeigt. Das gilt auch für externe Videos, die in einer E-Mail eingebettet werden. Die einzige Möglichkeit, Videos anzuzeigen, besteht in der Verwendung einer animierten GIF-Datei.