Before you send that email, make sure that you validate the HTML. Don't know how? Lyris' training manager gives you a head start.
When your readers open your email messages, do they say “huh?” Unless the HTML has been designed and tested for email, there’s a strong chance that the message is distorted at best. Even if the message renders beautifully in your web browser, the same HTML code may make your message completely illegible when viewed through many of the most popular email reading programs.
How can you make sure your HTML email looks right no matter what email client your readers use? Although there’s no universal standard for HTML in email, these six tips will help ensure HTML formatting problems don’t get in the way of your marketing message.
1. Use inline styles or HTML tags
Don’t be “classy” -- use inline styles or HTML tags to control how a message appears. It’s likely that your website uses cascading style sheets to define how text is displayed. Since the style sheet gives your site much of its character, it’s tempting to use it for your email messages, too, giving your readers a sense of continuity between email and site.
But many email clients like MSN/Hotmail simply ignore style sheets, embedded or external. To make sure your message renders properly, use inline styles or HTML tags -- or, be sure that the message’s appearance is at least acceptable if the styles aren’t displayed.
2. Keep background colors light and text dark
When everyone has black text on a white background, it’s tempting to try something different to make your email stand out.
But the reason why you don’t frequently see white text on a black background in email is because some email clients won’t display the white text. Instead of seeing the message, all some readers will see is a black box. Or, the dark background color won’t be displayed, making light-colored text invisible or illegible. When the text is dark on a light background, it will generally be legible.
3. Validate your HTML
If you think your message is fine because it looks great when you look at it with your web browser, think again. Web browsers are typically more forgiving of HTML errors than email clients.
WC3 offers an excellent (and free!) HTML validator. Keep in mind that even if your HTML is valid, it still may not look right when viewed in an email. But by validating your HTML, you can correct any obvious problems. An added bonus: a message with “clean” markup is less likely to be filtered as spam.
4. Put scripts, forms or flash on your website, not in your email
The same elements that add sizzle to your website will fizzle out in many email clients -- if the message gets there at all. Many ISPs filter out messages with scripts, however innocuous. And forms may not always work. If you want recipients to see your incredible new Flash piece, drive them to the website where it’s best viewed.
5. Put critical information in text, not images
Images are disabled by default in many of the major email clients -- AOL 9, Outlook 2003, Hotmail, Gmail and others. When recipients open a message with images in one of these clients, they’ll see red exes, warning messages, grey boxes… or nothing. If critical branding information is in those images, readers may not even be able to easily identify the source of the message and believe that it’s spam.
Even if the information in the image itself isn’t critical, be aware that the warning messages in Outlook 2003 can distort your message to the point where it’s illegible. Provide the image size, and the message will be legible even if the image isn’t there.
6. Put (almost) everything in an image
Yes, this strategy directly contradicts the previous one.
The idea is to make the offer so compelling in the subject line that even if the image is unavailable, the recipient wants to view it -- or go to the website anyway to learn more about the offer.
The advantage of an email “postcard” is that it always looks good -- when it’s viewable. However, this all-or-nothing approach only works if there’s a single message that can be encapsulated in an image: it won’t work for messages that have multiple offers, or have a different purpose (e.g., a newsletter). And even these messages must have some text containing opt-out instructions and email compliance information.
Ultimately, the only way to make sure your email messages are legible is to look at them -- in the preview pane, full screen, with and without images.
Many of your recipients probably use free email accounts, so get your own free accounts, too. If you have a large number of recipients at a particular ISP like AOL, it may be worth it to subscribe in order to make sure your message looks right for those customers. And it never hurts to view the message using different email clients like Outlook and Lotus Notes.
If the prospect of getting all these accounts and clients seems daunting, another option is to use a service that provides an “inbox snapshot” of what your message looks like in multiple email clients and email web readers, all in one place. Because these services can show so many clients, you’ll be able to save time -- and your peace of mind.
Wendy Roth is the training manager for Lyris Technologies, a pioneer in email marketing solutions since 1994. She works closely with enterprise-level marketing and advertising professionals to help them achieve their email-related objectives, and collaborates with engineering teams to ensure Lyris' products continue to be based on marketers' changing needs.