In part one of HTML Email Basics I discussed how to prepare an HTML email project. In this post I will discuss tips to keep in mind while writing and designing emails. Part 3 will cover what you need to be aware of when building your emails.
Writing the email
As you begin writing your email it’s best to keep these tips in mind:
- Choose an identifiable From Name. Subscribers first look to see whom the email is from, therefore you need to make sure your name is recognizable. If possible use your company or product name.
- Use a compelling subject line. The ins and outs of subject line writing are too detailed to go into here, but try to keep your messaging urgent, familial, free of spam words and 49 characters or less.
- Remember the preview pane. A majority of users view their emails through the preview pane first and only open the full email if it piques their interest. That really only gives you a space of roughly 550 x 300 pixels to communicate your branding and main call to action.
- Users read by scanning. Make sure your calls to action are clear and that you copy is scanable. Consider using short paragraphs and bullet lists to help with this.
- Follow CAN-SPAM regulations. Some of the requirements include unsubscribe links, the company’s physical address and copy indicating that the email is an advertisement. Learn more about CAN-SPAM requirements.
Designing the email
When it comes to email design your motto should be “keep it simple”. Each email client will display an HTML email differently, so it’s best to design for the lowest common denominator, even though it can feel quite limiting creatively.
To keep your experience as stress free as possible, I recommend following these key guidelines. Trust me, they will make your life easier.
- Keep your layout basic. HTML emails are built using tables and simple structures consistently work the best. Here are some examples of effective email structures.
- Keep your email width between 500 and 600 pixels. Doing so will ensure that the far sides will not be cut off in the viewing windows.
- Keep image blocking in mind. A wide array of email clients block images in emails, so they should be used as accents, not as the main content. Make sure the content of the email will be legible when the images are gone and always include alt text for your images.
- Forget about the rich media. It may be tempting to throw some Flash or video into your email, but it’s just going to cause more problems than it’s worth. Leave it out.
- Avoid background images. Outlook 2007 and other clients strip them out all together, which can turn your carefully designed email in to a big mess.
- Include your logo and call to action in the top 300 pixels of your design. That way people who never fully open your email will still know who you are and what you offer.
Those are the copy and design basics in a nutshell. Next time I’ll finish up with tips for programming your emails. In the meantime I recommend checking out the following websites for further information and examples on effective HTML email design.
http://www.campaignmonitor.com/resources/
http://www.mailchimp.com/resources/
Source: Email Marketing Design & Rendering: the New Essentials
