Five HTML E-mail Design Tips, Part 1
[Editor’s Note: This article first appeared in the debut issue of “All About E-Mail,” the new, free, weekly e-letter from the Target Marketing Group. To subscribe, click here. Look for Part 2 of this two-part series in the Sept. 10 edition of Giving 2.0, when the authors will explain the importance of designing for preview panes and testing your e-mail messages before they are deployed.]
HTML e-mail designers face a number of challenges when it comes to renderability across multiple e-mail programs. The lack of standards creates an environment where each ISP has its own rules. This means the same HTML code is assembled differently in each reader.
What looks great in one inbox could look terrible in the next, and e-mail designers must be aware of the differences for their e-mails to look good to every recipient. After all, how an e-mail looks is as important as what it says. And e-mails that contain missing graphics, broken links or formatting issues look sloppy and unimportant. What’s more, they have a much higher chance of being reported as spam.
E-mails should be designed for the lowest common denominator to render correctly in as many inboxes as possible. Below are some tips you can follow to avoid rendering issues in the major e-mail programs.
1. Stick to basic HTML. HTML e-mail design is light years behind Web design, so Web design rules don’t apply here. Stick to basic HTML since many complex coding tactics will be stripped out of messages.
2. Follow best practices for images. Images face unique rendering challenges because many ISPs turn them off by default. E-mails should be designed to look good with or without the images turned on.
When adding images, try the following:
* Use alt tags for every image. Be as descriptive as possible so recipients don’t have to turn images on to know what they’re missing. You may even include your offer or call-to-action in the alt so it remains visible at all times.
* Optimize images using GIF or JPEG formats and include height and width parameters so the sizing remains correct.
* Store images on a Web server and link them in the message using the full URL. This is the only way graphics will show up in e-mails.
