How to Design Your HTML Email for Optimal Deliverability

Design has become increasingly important in creating an enjoyable, and even acceptable, experience for today’s average web user. This trend is not going away. On the contrary, as users become more savvy and accustomed to friendly design, the bar for quality design will continue to rise.

However, good design does not necessarily mean fancy graphics and never-before-seen user interactivity, such as that which we find in the always innovative Google Doodles. Design often hinges more so on simplicity and functionality, as is the case with HTML emails. The importance of email design is two-fold: first, design plays a big part in getting your email into your customers inbox; once that hurdle is cleared, design helps encourage the user interaction that represents your true end goal.

The challenge of email design is a significant one. Even the best-designed emails may still have trouble making it to the inbox. Assuming you do earn your way past the spam filters, poor design might inspire the recipient to delete the message, or worse, label it as spam.

Luckily there are some proven best practices to ensure recipients not only receive but also read and interact with your messages:

1. Don’t Rely On Images to Communicate Your Email Value Proposition. Email readers tend to turn off images by default as a security measure. Therefore, focus on the HTML code and use images sparingly, to ensure that your messages render properly in the various email clients. You can set up individual email accounts at the different service providers and within various clients to send test messages to desktops and mobile devices. Or use an email preview tool to check how your messages render with images turned off before you deploy. In this way, you can ensure that you have adequate and appropriate text to entice the subscriber to display images and read your entire email.
2. Use the ALT tag & store images on a web server: Complete the alt tag with a description of each image so recipients will know what the image is that they are missing before they download. If the image contains a special offer, make sure the alt tag communicates that. You want the reader to download your full message and click the call to action. Also, don’t embed your images in the email, but rather store them on your server and link to them in your email. This will prevent broken images or avoid triggering spam filters that can categorize your email as junk.
3. Don’t use CSS. CSS support varies among email clients. Some strip it out entirely.  Instead, use standard HTML and avoid being enticed by the flexibility and ease CSS provides. If you must use CSS, link to it instead of embedding it in the email.
4. Double check your code. Make sure all of your tags are valid and closed. Spammers make mistakes, so you simply can’t do the same. Ensure that your code is a clean as possible to avoid triggering spam filters.
5. Include a browser link to your message. If all else fails, you want to give the recipient an easy way to access your message, even if that requires leaving their inbox. Include a link at the top of your message so they can view your email in their favorite browser.

Bonus Tip: Always include an unsubscribe option. Whether you link to a ‘preference center’ or provide a direct unsubscribe link, make it as easy as one click for recipients to remove themselves from your list and don’t make it difficult for the user to locate that link! The alternative for the subscriber is to report your message as spam. Spam complaints are used by ISPs to determine future delivery of your messages. If your complaint rate is too high, your messages will go undelivered.

By following these tips and constantly upping your design game, you’ll enjoy better deliverability and encourage greater engagement from your customers, followers and subscribers.

Have some tricks of your own up your sleeve? Feel free to share them in the comments below!

Last 5 posts by Tim Falls

• Why Legitimate App Email is Mistaken For Spam - April 26th, 2012
• Four Tips To Identify and Engage Inactive Subscribers - March 23rd, 2012
• Does SEM Affect Email Deliverability - February 28th, 2012
• How to Handle Email Bounces: Three Rules of Thumb - January 26th, 2012
• Tips and Tricks: Leveraging Transactional Emails for Marketing Success - October 27th, 2011