A few tips for an Outlook-proof Html

You just created your newsletter and it’s perfect. All the links work and you passed the spam check. You send a test email and… surprise! On Outlook it’s a mess! Texts are out of place and images are not visualized. Why?

Every provider reads emails’ HTML code in its own way, and in particular Outlook has problems in reading some tags, like background images.

Creating newsletters with our drag&drop editor K-Bricks is a good way to overcome such problems, but if you decide to use HTML you must be careful to avoid the most common mistakes.

Therefore, we are giving you some tips to create en Outlook-proof HTML!

CSS

  • Styles within <head> tag are ignored, therefore we suggest to always use in-line style.
  • <padding-top> is applied to all the <td> columns of the HTML, the only way to solve this problem is to specify the space between the elements and cells’ upper margin in the short form (margin: 20px 0 0 0), since the extended form (margin-top: 20px) creates some problems with Hotmail.
  • When you start a new paragraph within a tab, Outlook automatically add a space to separate the two elements: we suggest to always send a test email on Outlook before sending the campaign.
  • Line spacing gives some problems when it is set to values like 1.3. Moreover, if you set a value smaller than one, Outlook arranges characters randomly, creating unintelligible text lines.

Images

  • Animated images are blocked and only the first frame will be visualized, therefore consider if add them or not.
  • Most of the time, Outlook blocks background images. To avoid this, choose a single color for the background.
  • In the tabs, for images smaller than 12 pixels you always have to specify the <height> attribute, otherwise they will not be visualized.
  • Some Outlook versions don’t support images with spaces in the file name, so use “underscore” instead of it, for example “image_withou_spaces.png”.

Outlook considers HTML code as a document written with Word… exactly, just like a Word file. Over 1800 pixels (more or less the size of a one page Word file) Outlook divides the email in two parts. Therefore, avoid sending long newsletters: users don’t like to receive thing in half, and two consecutive emails can be seen as too harassing and users may decide to unsubscribe.

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *