HTML email doesn't look the same in Outlook, Entourage, Gmail, Hotmail, Yahoo, etc.

This topic is by no means new. As a matter of fact, most of you who has experience designing HTML email know this already: The way different email clients understand and render HTML codes are very different. For starters, here are several points I've taken from my experience along with this article from sitepoint: How to Code HTML Email Newsletters.

• Use HTML tables to control the design and layout and set all cellspacing and cellpadding to 0.
  
• User Inline CSS only.
• Avoid custom margin and padding properties for inline CSS.
• Breakout all CSS individual properties, avoid shorthand CSS.
• Do not use background images (Gmail don't display them).
  
• Do not use line-height properties (Outlook and Hotmail don't understand them).
• Specify all image height and width (Outlook 2003 and Outlook web access with image off will break the layout).
• Add "display: inline;" on all images (Hotmail and Outlook 2003 will add default spacing on them).
• Avoid defining table cell width using percentage value.
• Avoid using div elements to define overall layout.
• No Flash elements and javascript elements.

As you can see, there are a lot of things to consider when it comes to design an HTML email. But to ensure compatibility across all email clients, you can utilize email testing services like Litmus (One time, monthly or free) where you can test your email on Gmail and Outlook 2003 for free, and a lot more for their paid services. Another service you can check out is Campaign Monitor with similar functionalities. (Disclaimer: I'm not endorsing any of these products, they are only used as examples).

Next time I'll talk a little bit on inbox penetration and delivery systems, and maybe a bit more about social media and emailing.