February 10th, 2010 by HTML email design elements should be simple, minimal and non-essential. This is the second article in a three-part series on HTML email. You can also download these HTML email design tips in PDF. Check out MailChimp’s comprehensive how to HTML email marketing guide for a lot of great best practices. We’ve condensed and reorganized many of those HTML email tips to specifically address designers.
Design HTML email for the unique medium.
- Use simple static images because interactive elements like Flash, movies, and Javascript won’t work.
- Use graphics minimally because image-heavy emails can look like spam.
- Make your images non-essential because webmail programs will frequently turn off image-loading by default. Your email should communicate well even without the images.
- Avoid using background images and tiling because some email programs, like Outlook, won’t show them. You can use them if they don’t matter.
- Set your canvas to 500-600 pixels wide to fit smaller preview windows.
- Design the recognizable brand to fit into the top leftmost 200×200 square because of tiny preview panes in some email programs. Give subscribers a reason to open the email in a full window.
- Make the first line of text relevant and unique because it will show in Gmail and future programs that show a snippet of the first line along with subject lines.
- Design plain-text formatting with headings, lists, links, dividers, etc.
- Read SitePoint’s HTML email design principles.
Include essential elements.
- From name should be recognizable.
- Subject line shouldn’t look spammy.
- To line should be personalized with a name, not just an email address.
- One-click opt-out link should be easy to access, perhaps at the top.
- Link to an archived web version just in case the template breaks.
- Link to a privacy policy page.
- Street address, phone number and other contact information adds legitimacy.
- Reminder how the subscribers got on your list.
Also in this series
Related posts:
- How to code HTML email — tips for coders When exploring how to code HTML email, keep in mind...
- Email blast marketing — tips for email list owners HTML email blast marketing has advantages over plain-text because HTML...
