Five HTML E-mail Design Tips, Part 2

August 22, 2008 By Matt Elliott,Brent Shroyer

singlepage

HTML e-mail designers face a number of challenges when it comes to renderability across multiple e-mail programs. But there are a number of tips you can follow to avoid rendering issues in the major e-mail programs.

In Part 2 of this two-part series, we explain how designing for the preview pane and testing e-mail messages can avoid rendering issues in e-mail programs.

(To view Part 1, in which Elliott and Shroyer discuss how sticking to basic HTML and following best practices for images and content can help avoid rendering issues in e-mail programs, click here.)

4. Design for the preview pane. Remember that most of your recipients will first read your message in the preview pane, or the window in an e-mail program that lets the user preview an e-mail message without actually clicking or opening the message, so design accordingly.

• Branding, important messaging and calls to action should be visible above the fold, or within the top 300 pixels, so recipients don't have to scroll to see the offer.
• Keep e-mails to a maximum width of 600 pixels and a maximum size of 40k. This width might seem small, but considering that the overwhelming majority of your recipients will use the preview pane to determine whether or not to open your message, you should size it so it can be read without scrolling horizontally.

5. Test the message. Most formatting issues can be fixed before the message is deployed, so it is imperative that you run a number of tests prior to deploying the message.

• Set up e-mail addresses at the major ISPs and e-mail a test version of the message to yourself. Or, use a third party to perform these tests for you. This will expose a large percentage of the issues in advance.
• Run your message through a software or service that rates your spam score. The higher the score, the more "spam-like" an e-mail message appears. A low spam score greatly increases the deliverability of the message.
• Double-check all of the code and remove anything that isn't needed, such as meta tags or extraneous code added in some WYSIWYG editors.

Following the best practices outlined above and remembering to keep your messages simple and straightforward will not only help you avoid rendering issues across the major ISPs, but you'll also enjoy higher deliverability and increased responses from your recipients.

Matt Elliott is director of client services and Brent Shroyer is product manager for Listrak, a Lititz, Pa.-based e-mail marketing company. Reach Matt at melliott@listrak.com, and Brent at bshroyer@listrak.com.

• MORE ON
• EMAIL MARKETING