Darstellung Ihres Mailings in Outlook

Leider kann es bei der Darstellung von Newslettern und Mailings in Microsoft Outlook 2007, 2010 und 2013 zu unerwünschten und unerwarteten Darstellungsproblemen kommen. 

Um Ihnen bei der Gestaltung Ihres Mailings zu helfen und um möglichen Frustrationen vorzubeugen, möchten wir Ihnen einige nützliche Tipps und Tricks an die Hand geben. Diese sollen Ihnen dabei helfen, eventuelle Hindernisse zu umgehen und kleine Anpassungen vorzunehmen, sodass Sie eine ansprechende Präsentation Ihrer E-Mails erreichen können:

Anzeige von E-Mails in Outlook verbessern 

Abweichende Schriftgröße und Schriftarten

Die Schriftarten, die Sie in Ihrer E-Mail verwenden, können in der Größe und im Stil von dem abweichen, was Sie im Drag & Drop Editor ausgewählt haben. Achten Sie auf:

  1. Systemeigene Schriftarten wie Arial und Calibri werden auf allen E-Mail-Clients, einschließlich Outlook, korrekt angezeigt. Hingegen werden Google-Schriftarten fast immer unterschiedlich dargestellt.
  2. Die Darstellung von Schriftarten in E-Mail-Clients hängt von verschiedenen Faktoren ab, darunter das Betriebssystem (PC/MAC) und der Webbrowser, den der Empfänger verwendet.

Tipp: Wir empfehlen standardmäßige Systemschriftarten für Ihre E-Mail-Kampagnen zu verwenden.

Ränder (Margin) um Bilder werden nicht angezeigt 

In allen Versionen von Outlook (Ausnahme Outlook.com), werden Ränder um Bilder nicht berücksichtigt. Dies bedeutet, dass es sein kann, dass kein Abstand zwischen Ihrem Text und dem Bild vorhanden ist, selbst wenn Sie in den Einstellungen Ränder hinzugefügt haben.

Tipp: Deshalb sollten für gewünschte Abstände padding oder Tabellenzellen mit festen Höhenangaben benutzt werden. Sie können auch mit mit hspace und/oder vspace arbeiten:
<img scr="http://www.test.de/test.jpg" align=“left“ vspace=“10“ hspace=“10“ />

Bilder werden nicht korrekt dargestellt

  1. Hintergrundbilder (background-images) unterstützt Outlook leider nicht. 

  2. Bilder mit einer zu großen Höhe werden von oben an abgeschnitten, wenn diese größer als 1728 Pixel sind. Ist Ihr Bild zum Beispiel 2000 Pixel groß, so werden von oben 272 Pixel abgeschnitten. 

  3. Bilder mit anderen Dimensionen als das Originalbild werden falsch dargestellt, wenn es zum Beispiel gestreckt wird. Bilder sollten im HTML-Code immer korrekte Dimensionsangaben besitzen, wenn die Bilder für das Layout wichtig sind. Am besten sollten die Bilder schon vorab bearbeitet worden sein.
  4. Animierte GIFs werden seit Outlook 2007 nicht mehr unterstützt.
  5. Per HTML zusammengefügte Bilder können in Outlook 2013 ungewollte Abstände (ungefähr 10 Pixel) verursachen, während in Outlook 2010 und 2007 diese korrekt dar gestellt werden.

Schaltflächen sind fehlerhaft

  1. Schaltflächen mit fehlerhaftem Text oder Text, der in eine zweite Zeile umgebrochen wird, sind auf ein Rendering-Problem in Outlook zurückzuführen.
    Tipp: Versuchen Sie das Padding Ihrer Schaltfläche größer zu machen als die Schriftgröße.

  2. Sie können auch ein Bild einer Schaltfläche einfügen und es wie jedes andere Bild in Ihre E-Mail hochladen. Durch eine Verlinkung können dann Empfänger, die auf das Bild klicken, zu Ihrer hinterlegen URL weitergeleitet werden.

  3. Schaltflächen mit abgerundeten Ecken werden in Outlook als Rechtecke angezeigt. Das passiert, weil die CSS-Eigenschaft border-radius nicht nativ unterstützt wird. Damit Schaltflächen mit abgerundeten Ecken in Outlook angezeigt werden, müssen Sie ein Bild Ihrer Schaltfläche erstellen und es in Ihre E-Mail importieren wie in Schritt 2 erwähnt.

Darstellung von Tabellen anpassen

  1. Generell sollten Newsletter im Tabellenlayout (mit festen Breiten) erstellt und Divs vermieden werden.
  2. Tabellen erzeugen automatisch eine ungewollte Lücke, wenn diese eine Höhe von ungefähr 1790 Pixel überschreitet. Outlook möchte damit eine Unterteilung erzwingen. Das kann umgegangen werden, indem Sie mit mehreren Tabellen arbeiten.
  3. Für Tabellen (<table>) sollten Sie cellpadding und cellspacing verwenden, da margin und padding öfters an ihre Tabellenzellen weitergegeben werden.

  4. Automatische Zeilenumbrüche müssen bei zu langen Wörtern manuell mit inline-Style einer Tabellenzelle angepasst werden.
  5. Outlook fügt automatisch eine 1px border um Zellen.

Tipp: Listen sollten Sie vermeiden, wenn Spacing wichtig ist. Stattdessen sollten Sie Tabellen (<table>) mit ihren Zellen nutzen.

Meistens treten Outlook-Probleme mit selbst programmierten Vorlagen auf. Bitte testen Sie in solchen Fällen die Nutzung einer Basisvorlage von CleverReach. 

 

Hilfe & Support

Bitte beachten Sie, dass wir bei Darstellungsproblemen in Microsoft Outlook keinen detaillierten Support leisten können.
Sollten Sie andere Fragen haben oder Hilfe benötigen, können Sie jederzeit gerne unser Service Team kontaktieren.