HTML Email: The Biggest Mistake

June 5, 2013

I am actually working on writing a guide to html email design and best practices called Modern HTML Email. You can learn more here.

There is a lot to keep in mind when working on HTML email marketing. From the legal requirements - did people actually opt-in to hear from you? - to coding practices - did I mark everything up in tables? - there are a ton of places where mistakes can happen. Yet, there is one area where most newsletters really drop the ball. One mistake that makes most people trash that email, ignore future emails, and - worst of all - unsubscribe from a list. What mistake is rampant in email marketing today?

Using Images for Important Messaging

Take a look at this email from Barnes and Noble Booksellers below:

BN looks ok now

At first glance, it looks just fine. It’s a standard marketing email. Fairly colorful, messaging is on-point, and it features some recent items that people will be interested in. So where is the problem?

The problem happens in the email client. These days, most email clients - both web and native - block images by default when viewing an email. That means that any messaging you have within an image will not be displayed - the user will see a bunch of blank boxes with either a message telling them to “right-click to download images” or the alt-text from the image tag (assuming whoever sent it bothered to fill in that attribute). Let’s take another look at that Barnes and Noble newsletter, but with the images disabled this time:

But look at this email with images off

Do you see how this could be a major roadblock to achieving your marketing goals? What do you think a user’s reaction will be when they see this on screen? Chances are most people will ignore it. They’ll return to their inbox to see what else is there, they’ll delete it, and in some cases - instead of downloading the images - they’ll look for the unsubscribe link and kill any chance of you marketing to them again. I love looking at HTML email campaigns but I still delete most emails I get like this. And if they keep sending them, it’s only a matter of time before I unsubscribe.

By completely imprisoning your message in images - you have effectively ruined that email campaign. You will lose clicks, opens, and subscribers. Maybe not on your first send, but if you keep this practice up, your marketing efforts will go to waste. Not a good position to be in.

A Better Email

So how do you account for this problem? It’s easy - just don’t lock up your message in images. You should always have your most important messaging in the copy of the email and rely on images to illustrate that message and entice the reader. While it is fine to have some elements of the message within an image, you need to insure that the message will not be lost with images disabled. One company that consistently does this well is Campaign Monitor, an email service provider. Their email newsletters are amongst the best in the business and illustrate how best to utilize and account for images in an email. Take a look at one of their campaigns:

Campaign Monitor makes great looking emails

Looks fantastic, doesn’t it? The design is clean and structured, and it’s easy to tell what the messaging is for each section. But how does it look when images are turned off? Let’s take a look:

Campaign Monitor does email right

Pretty damned good. While you lose the impact of the visuals, none of the messaging is really sacrificed. Both Barnes and Noble and Campaign Monitor use alt-text to account for images being disabled, but Campaign Monitor insures that there is clear, well-written copy visible so that none of the newsletter’s messaging is compromised. Campaign Monitor’s email is a shining example of how to tackle modern HTML email design.

There are a lot of things that can go wrong with email marketing. So long as you account for a variety of scenarios and keep in mind what is important to any campaign - in this case the visibility of your message - then you will find that you are better off than a lot of marketers out there. Keep your design clean, your message clear, and keep emailing!