In part two of HTML Email Basics I discussed how to write and design an HTML email. In this post I will discuss tips to keep in mind when programming your email.
Programming HTML emails
Like HTML email design, HTML email programming must be kept simple. Instead of divs think tables and instead of style sheets think simple inline CSS. Follow the tips below to help ensure your email will display correctly across a variety of email clients.
- Build your HTML email with tables. As backwards as it may sound, HTML emails must be built with tables to display correctly. Try to keep your tables as clean as possible too. Avoid anything that is unnecessary and try not to nest your tables if possible.
- Avoid using background images. Outlook 2007, Lotus Notes and Gmail all have issues with them. Save yourself some time and headache by avoiding them all together.
- Keep your code as clean and detailed as possible. Specify <td> and <table> widths and avoid colspan and rowspans. This is important for all email clients, but Lotus Notes especially.
- Use inline CSS. Don’t even think about using CSS style sheets for your email. To style text and links put your CSS inline. Gmail is especially picky about this. Also, try not to use CSS for positioning, use tables for that.
- Don’t use forms. Neither Outlook or Hotmail like forms, but each for different reasons. If you really want to have a form, link to one on a website.
- Test, test, test. Take advantage of Campaignmonitor.com’s testing service, or at the very least send the email to yourself and check it in a variety of email clients. Even when you follow the rules religiously you will still encounter issues. You may only get one chance to reach your audience, so make sure your email works.
Those are the programming basics in a nutshell. For more information about programming for specific email clients, take a look at either Campaign Monitor or MailChip.
http://www.campaignmonitor.com/resources/
http://www.mailchimp.com/resources/
Source: Email Marketing Design and Rendering: The New Essentials ExactTarget
