Designing and sending HTML newsletters can be a little tacky sometimes. The output of HTML in email apps is still much more limited than in web browsers, which means that you have to adapt the way you are designing your email templates. Following are a few tips to improve the HTML of your newsletters.
1. Use inline CSS styles
Unfortunatly you’ll have to forget about external style for email template design. The best solution is to declare the CSS in your HTML tags like that: <p style=”color:#000;”>. If you declare your CSS in your header, Gmail will not read it which you do not want.
2. Limit the width of your template
When creating a template for your email campaigns, don’t forget that many of your subscribers will read it in an online email app like Gmail or Hotmail. Most email software will have a sidebar that takes away some space, so it would be safe to have a template that doesn’t overpass 600px wide.
3. Avoid using too many images
Most of the time email apps will block images unless the user allows them, so you should not rely too much on images for your email understanding or the readers will just see an empty (or almost) email.
4. Offer a link that lets the subscribers unsubscribe
This is just good manners, don’t force your newsletter subscribers to stay subscribed if they don’t want to. What would you think if sales people locked the door behind you when you enter a shop?
5. Let your subscribers access the web version of the email
This gives you a way to offer a well layed-out version of your email to readers who can’t read it in their email app.
6. Don’t use flash
Most email clients will not read flash objects, so it’s not a very good idea to include it. Sometimes it will even give you security alerts.
7. Suggest to your readers to add you to their contact list
By doing this, you’re inviting your subscribers to create a closer relationship, but you also avoid getting your email ending up in the spam folder and get a better chance to have your images displayed.
8. Don’t use forms in your emails
It will not work in most email readers, just link to a form on the web.
9. Add the dimensions to images
Adding dimensions will help by showing a placeholder when images are not displayed, which will help for not breaking your layout even when images are not shown.
10. Provide an alternate text to all your images
If the images are not shown, let the users know what they are missing.
11. Don’t use PNGs with alpha transparency
Some email apps will not display PNG transparency, Lotus Notes 6 and 7 will not even display PNGs at all, so why bother? I’m afraid that you’ll have to wait that email apps evolve.
12. Don’t use CSS images
CSS background images (example: background:url(image.jpg);) will not display in many email programs, so try to avoid them.
13. Have a text-only version of your email
For the readers who can’t access your HTML email, make sure they can read it by providing a text-only version of the newsletter.
0 comments:
Post a Comment