Tag Archives: animated gifs

The Past Year in Email

Happy New Yer!
Another year has come and gone, and although after the events of last year it seemed like the earth was about to spin off its axis, we’re still here and email is as strong as ever. It’s time once again for our annual look back at the best and worst examples of email of the past year. There are a few old favorites and a few surprises. We’ll start with that old chestnut that never seems to go away: The Bad Mail Merge.

Dear your name here,

bad mail merge

A few years ago, faulty mail merges, like those in the example above above, were the most common mistakes we saw. Attempts to sound personal suddenly have the opposite effect, pulling back the curtain and showing that the email for what it is: a pre-written script with information inserted as needed. This particular template called for both a first name and a company name, neither of which was available. The use of dynamic content instead of a merge could have avoided this problem by given the mailing other options when information was missing. It’s never good when a company that is trying to sell you on their technological prowess can’t assemble an email correctly.

The example below is even more egregious since it purports to be aimed at a specific person. This, coupled with the formatting errors in the apparently meaningless text below the main message (see UTF-8 discussion below), sent this one on a quick trip to the Spam Folder.

bad mail merge #2

While not as bad as either of the errors, another problem that cropped up in a new mailings was the repeat of my first name. Since I’m sure I never put my name in a field twice, I have to assume that the problem is somewhere in the email’s dynamic content structure.

merge error

Aw Gee-Mail

Weather error

Personalization can be a great way to start an email, but it has its limitations. The example above has my name, and a shout out the weather. The only problem, here’s the weather in Moraga for the day this email was sent:

actual weather

Not exactly sunny. I’m not sure if the “sunshine” comment was a dynamic insert based on some erroneous weather predictor, or simply an educated guess on the part of the sender. Either way, receiving this message on the coldest, most overcast day of the summer made us chuckle.

Time’s a-Wastin’!

jumping the gun

It seems like stores push closer and closer to Halloween when it comes to holiday sales. Kohl’s takes it one step further by announcing that you just have a few hours left for your Black Friday deals three weeks before Black Friday! From the content, it looks like this mailing was intended to be sent out on the 1st, but Black Friday threats simply won’t work in that case.

Musicians Who are Pushing

snippet cutoff

Gmail and other email clients like to give you a peek at what to expect before you open the mailing. You can use this your advantage with a preheader. Just make sure that when that preheader is abbreviated, you don’t end up with a different message. Musicbed made use of a preheader, but didn’t take into consideration what happened to the preheader when the window wasn’t big enough to fit the whole thing. They ended up with “musicians who are pushing,” instead of “musicians who are pushing the genre to new place.” Perhaps out of paranoia, Patrick James avoids the problem altogether by using a short preheader message followed by a long series of periods.

Amusingly, this particular problem isn’t limited to email. In 1998, a campaign in New York state to provide schools with pencils that featured an anti-drug message had to be pulled when kids started noticing that the more you sharpened the pencils, the more pro-drug the message became.

too cool to do drugs
Source: http://www.nytimes.com/1998/12/12/nyregion/slogan-causes-pencil-recall.html

It’s All Ελληνικά To Me

How you code your email can make the difference between a readable message and gibberish. An email written using 8-bit Unicode characters and then coded for 7-bit ASCII is going to have some problems. Some times you see this immediately in the subject lines:

utf errors

And sometimes it appears in the body copy. Normally, these snippets of code standout, and do little more than interfere with the design, but if you’ve created an email that relies directly on UTF-8 Unicode to get its idea across, you’re going to be in trouble. That’s what happened with ThinkGeek’s otherwise clever mailing:

thinkgeek

The text below the image was supposed to be a humorous paragraph printed upside-down and backwards, as an in-joke to the Stranger Things TV show. If you look at the source code, you’ll find the original message was:

“˙soƃƃƎ puᴉɟ ll,noʎ ‘ɹǝzǝǝɹɟ ǝɔᴉɟɟo ɹno uǝdo noʎ ɟI ˙pǝʇᴉɔxǝ ǝɹoɯ sn ƃuᴉʞɐɯ ʇsnɾ s,ʇɐɥʇ ǝsᴉpuɐɥɔɹǝɯ unɟ ɟo sʇɹos llɐ uᴉ ƃuᴉʇʇǝƃ ǝɹ,ǝʍ pu∀ (˙ɥʇuoɯ sᴉɥʇ sn pǝʇᴉsᴉʌ ǝʌ,noʎ ɟᴉ pǝɔᴉʇou ǝʌɐɥ ʎɐɯ no⅄) ˙sƃuᴉɥ┴ ɹǝƃuɐɹʇS ɟo uosɐǝs ʇxǝu ǝɥʇ ɹoɟ pǝʇᴉɔxǝ ʎʇʇǝɹd ǝɹ,ǝM”

Which, when view right-side up and reversed, reads:

“We’re pretty excited for the next season of Stranger Things. (You may have noticed if you’ve visited us this month.) And we’re getting in all sorts of fun merchandise that’s just making us more excited. If you open our office freezer, you’ll find Eggos.”

Unfortunately, the email was sent without the Unicode specification required to render the sentence, turning the message into gibberish.

Email Tourette Syndrome

unwanted code

Sometimes you can end up with gibberish inserting itself in an email for other reasons. In the example above, it looks like the URL was accidentally and replaced with the ALT tag, leaving only the query string. In the examples below, the problem was a matter of placement of conditional comments. Conditional comments are a way to assign special instructions that only Internet Explorer will read. To everything else, they will appear as comments and won’t display. The problem is that they can sometimes show up as text depending on where they are placed in an email.

While we understand the value of conditional comments, people are beginning to migrate away from IE, in favor of better alternatives. You might want to check your subscriber base and see if you even need them anymore.

A Bad Case of Mono

monograms or monographs?

This image came in an email from the normally exceptional email marketers at Email Monks. For the moment, I’m going to ignore the grammatical error in the ribbon banner at the top and concentrate on the type categories shown. I have no problem with Serif and Sans Serif, but there’s no such type style as “Monogram.” These are monograms:

monograms

What they meant was “monospaced.” Their description doesn’t make much (if any) sense either (and one more grammatical error to boot). A monospaced font is a font in which every characters takes the same amount of space, so a lower case “i” will take as much room as an uppercase “M,” even though the two characters clearly require different amounts of space. While the fourth category (Calligraphy) is a legitimate font category, in this case I would have used the more general category of “Decorative” as the final classification (of which Calligraphic fonts are a subset).

Give Me Some Room!

tanga on iphone

This email from Tanga looks fine on a desktop computer, and even a tablet, but reduce it to iPhone size and it suddenly turns into this scrunched up mess. Looking at the code, we see that whoever designed this is much more comfortable with HTML than CSS. The content is rife with deprecated attributes and the designer has used cells with non-breaking spaces to create margins. Either this was created many years ago, or someone needs to brush up on their CSS.

As bad as this is, at least all the content still appears on the page (albeit in a very squished format). Not so for Vibes’ webinar announcement. While it will appear just fine in most email clients. Something in its code just falls apart when opened in Live Mail. We’ve discussed the problems with Live Mail in previous year-end reviews, but now that Microsoft has abandoned it, maybe the folks at Vibes didn’t think it was worth the effort to fix.

Responsible Responsive

Responsive design was all the rage a few years ago. As we discussed in Part Four of our Responsive Email Design series, if you use a standardized template, then setting up a responsive template has advantages. It will mean a little extra work at the start but will yield dividends later on. Clearly, the folks at BangGoods didn’t read that article, because this is how their mailings appear on an iPhone:

This is a perfect layout for a responsive approach. The three columns across is fine for a desktop monitor, but it is rendered almost unreadable on most phones. Media queries that realigned the three columns and enlarged them according to screen size would do a world of good here.

The British Film Institute (BFI) takes a different approach. They do use responsive design, but they only use one column, so the main purpose of the media query is the adjust the size of the tables based on the screen size. This works well for the iPhone:

But not so well for the iPad:

They had the right idea, but set the size change at the wrong point, leading to an unnecessarily small display on the iPad mini.

Unsubscribe? Fuggedaboutit!

Until this point, most of the mistakes we’ve listed have been embarrassing at worst, but these next two aren’t simply bad mistakes—they’re against the law. CAN-SPAM requires the ability to unsubscribe. That can be accomplished a number of ways, but the most common is with an unsubscribe link. If you put an unsubscribe link in your email, it better work. That’s not the case for Proline Tools and Longchamp. In the case of Proline Tools, clicking unsub takes you to the following page:

This suggests that the problem only was temporary, but a second attempt to click on the unsubscribe link a two weeks later yielded the same result.

Similarly, clicking on the unsub link from Wengtek.com takes you to this page:

On the plus side, clicking on any link in the Wengtek mailing took me to this page, so this might simply be an ESP issue. Since the email purported to be from Longchamp, I would classify this one as Spam and move on.

tl;dr

A related problem occurs when you have too much text in your mailings. Some email clients, such as Gmail, will choose to cut off the message with the following notice:

This particular email is from Kohl’s whose list of caveats and cautions could fill a book. When this happens, the unsubscribe link is not displayed. Does that mean the email is breaking the law? Probably not, but it does mean one more step to get to it. In case you’re interested, here is the entire block of legal notices at the bottom of that email (reduced for the sake of brevity):

At least, in this case, the only thing missing besides the footer is a lot of legalese that no one ever reads anyway. Not so for Touch of Modern, whose email gets clipped like this:

Touch of Modern specializes in expensive products for gadget lovers and technophiles, and their emails are often a solid wall of these products. So much so, that they often get clipped for being too long. So how much is missing? When you click “View entire image,” you not only get the footer, but an additional 132 products are displayed as well. They would have been better off reducing the size of their email, concentrating on a few items each time, and using the website to present additional items.

The Good

This year we also saw some nice use of animated gifs and clever subject lines. The leader this year was EmailMonks, who offered games for Easter and Thanksgiving, an interactive Halloween mailings, and some clever videos and gifs. Where the email clients could interpret the code, the games could be played right there in the message. When that wasn’t possible the viewer was linked to the online version. The also get points for their clever use of poster gifs that do a good job of leading the viewer to the linked video (see Using HTML5 in Email: Video).

Cinemagraphs

One technique we were hoping to see more of this year was the use of cinemagraphs. These are the animated gifs that use animation sparingly to create the effect of a live video image. One company that put the technique to good use is Bourbon and Boots, who used a smoking cigar to draw the eye to the image. Subtle but effective, and it captures the essence of the company’s brand.

One of the cleverest uses of an animated gif came from Netflix, but they didn’t stop there. The design concept started with the subject line:

The blacked out lines and the subject matter make us slightly uneasy, but still curious. Upon opening the email, you are presented with a startling animated gif:

[Note: The original gif only goes through its animation one time, I’ve set it up to repeat to make it easier to view.]

A very clever combination of subject line and content used to create an effect.

Until Next Time

That will do it for this year. As usual, most of the errors could have easily been avoided by a little testing before sending. We were happy to that certain errors that were once very common, now only happen occasionally. Marketers are getting more email savvy and template designs are improving. As an added note, I recently heard from Jordie van Rijn from eMailMonday, who has created this pre-launch checklist you can use to make sure everything in order before you hit the send button.

Happy New Year!

Using Animated Gifs in Email

First off, let’s get the oldest question out of the way—how to pronounce Gif. According to Steve Wilhite, who invented the format, it should be pronounced “jiff.” You’d think that would settle the matter, but it only polarized the factions. Recently, no less than President Obama weighed in on the subject, pronouncing it with a hard “G” and saying he pondered the pronunciation a “long time” and that was his “official position” on the subject. Dictionaries don’t even try to settle this argument, listing both pronunciations as acceptable.

Almost as contentious as the pronunciation is the format’s value when it comes to using animations in email marketing. Jessie-Lee Nichols of Quintain Marketing lists three ways to use animated gifs in your email marketing, while Arienne Holland at Raven Internet Marketing Tools cites three reasons to not use animated gifs in your emails. In spite of the seemingly contradictory nature of these statements, they both make some valid points. Gifs can be valuable tools for increasing email engagement, sharing, and clickthroughs, but they can have the opposite effect, distracting from the message and annoying the viewer.

What’s My Motivation?

This question isn’t just for actors. It’s the first question any email marketer needs to ask before committing to the time and effort of creating an animated gif. Just because you know how to make them doesn’t mean you should automatically use them. There is always a temptation to test out new tools, especially flashy ones, but you should first ask yourself: “Is there any advantage to using an animated message?” You could also turn this question around and ask if there is any disadvantage to using a non-animated image. If the answer to either of these questions is no, then you might as well use a static image.

So what are the advantages of animated gifs? Here are the main ones:

  • To provide visual stimulus
  • To include more than one item in the same space
  • To show things not easily comprehended with static images
  • To encourage sharing

These are all good reasons, but let’s take a look at them one at a time.

Hey! Look At Me!

The most common reason for the addition of animated gifs to a mailing is to provide visual stimulation for the reader. Ideally, it should make them want to investigate further. It shouldn’t make them want to hit delete, but that’s what will happen if you make your gifs too busy. A well-designed gif will have just enough animation to entice the viewer into clicking the link. Here’s a good example from Bed, Bath & Beyond:
BB&B fans
The dog’s ears flapping in the breeze invoke an almost tactile response. We can feel the breeze just looking at the picture. If the viewer is in a hot room, this might be enough to provoke a purchase.

More importantly, look at the position of the dog—right in the center of the image with all the products and pricing information surrounding it. One of the biggest dangers of animation is that it can distract the eye from the primary message. Here’s one from the clothing retailer, Singer22:
email-marketing-singer22-2With all that activity on the left side of the image, it’s doubtful that anyone takes time to read the actual message. Fortunately in this case, the message isn’t that important, but it does demonstrate the effect an animation can have on where the reader looks. The problem is exacerbated by the fact that it is set up as a continuous loop. In highly active animation like this, one time through is enough. Let the animation end so that the reader can move on to the actual message.

The Above-the-Fold Advantage

Another common use of animated gifs—especially in the retail market—is to provide multiple images that cycle continuous in the mailing’s hero image. As it is with web pages and search engines, a certain percentage of the public never touches the scroll bar if they can help it. It’s always a good idea to make sure the main message is in plain view when the recipient opens the email, but suppose you are trying to present more than one item? You then are faced with the choice of stacking several images in the email and hoping that the reader looks at all of them, or creating an animated gif that cycles through the images. Here is an example from Andrew Marc:
andrewmarc1If you decide to use this technique, keep in mind that the choice of images should dictate the speed at which the images change. The default time that most companies use is one second, which is fine when you are dealing with variations on the same basic product, as is the case in the example above, but if you plan to show a disparate collection images, a slower cycle rate is recommended. Here is a particularly bad example from Levenger:
toofastanimationAlthough most of these products are related to iPad accessories, the images are as different as can be. With each image, the viewer must reassess the image to make sense of it, by the time the viewer has done this, the image has changed and the process begins again. If your gif is made up of images that have little or nothing in common (e.g., a red purse, followed by black shoes, followed by a blue shirt), one second is too short a period for the human eye to adjust to the differences between the images. Allow each image at least a second-and-a-half before changing. You can further soften the shifts between images by adding dissolves, but keep in mind that this will increase the file size substantially. A three image gif that is 200 Kb without dissolves, will balloon to over a megabyte when dissolves are added.

As if the rapid-fire changes in the Levenger gif weren’t enough, the gif includes five images. As a rule, it is best to keep these slideshow gifs to a maximum of four different images. More than that and you run the risk of losing the viewer’s attention. Three images is ideal.

So That’s How It Works!

When Dell introduced their new XPS 12 Convertible Ultrabook, they wanted a quick way to show the computer’s ability to switch from a laptop to a tablet. One option was to show the process in a series of images, but that meant the recipient would have to scroll through the email to understand how the device works—always a risky proposition. No single image could adequately explain the feature, so the decision was made to use an animated gif in the email.
Dell XPS12This approach works well in this instance. The final size is only 512Kb, which is remarkably small for a gif containing 59 panels.

Generating Buzz

When Netflix announced their second season of their series, House of Cards, they used an animated gif that proved to be so popular almost everyone who received it, forwarded it on to someone else:
Netflix House of CardsWhile we’re sure that the folks at Netflix knew they had a clever animated gif on their hands, we don’t think they knew it would end up canvassing the Internet like it did. Things like that are hard to predict and hard to plan for. Nine out of ten attempts at viral marketing fall short, but that has never stopped anyone from trying. The Netflix example has a slightly creepy quality and its motion is minimal enough to keep from being annoying, but it might have been a good idea to include their url or logo somewhere on the gif in case the image got separated from the original message (which is exactly what happened).

Cinemagraphs

The minimal use of motion is part of why the Netflix gif works. In all likelihood, a flashier, hyperkinetic gif would have had a less favorable response. The subtler approach defies the usual expectations of an animated gif. It is related to an animation form called a cinemagraph. In a cinemagraph, the action is often minimal and repetitive—a waterfall, or a breeze blowing a woman’s hair. The dog in the Bed, Bath & Beyond mailing certainly qualifies as an example of this. Here’s another example from Pizza Express:
animated gifThe animation is a small enough portion of the image to keep from being distraction, but is interesting enough to make you want to explore further. In their usual fashion, however, Pizza Express didn’t stop with the animation, but made sure the message got across even when the images weren’t displayed (see 2013: The Year in Email). For further information on cinemagraphs, Internet Marketing Specialist Shane Eubanks has several beautiful examples on his blog.

The First Frame Solution

There is really only one major email client that won’t display animated gifs. Unfortunately, that email client is Microsoft Outlook. Although older versions of the software will display animated gifs, every version of Outlook since 2007 stops at the first frame. A gif that brings out the details of a sale as it moves along, must be sure to start the animation with a zero time interval of the last frame before beginning the animation. In the example below (shown here without animation) Bed, Bath & Beyond used animation to show the details of their sale.
BB&B truck
Bed, Bath & Beyond was careful to start their animation with this final frame, so Outlook users got the entire message. The marketers at Kohl’s were not so careful. Here’s the first frame their version of a similar concept (a truck pulling details of a sale across the screen):

Kohl no animationSince Microsoft Outlook is the only major email reader that does not render animated gifs, it is conceivable to take advantage of this by providing an Outlook specific message as the first frame, although, in real world situations, this approach is of limited use.

Always Split Test

Even if you are positive that your animated gif will generate more clickthroughs and yield better results, we recommend that you split test it first. As the Marketing Team for the Obama campaign discovered during the last presidential election, what may seem like the best choice to you might not be the one that performs the best in the real world. You may have some emotional investment in that finely-crafted animated gif you spent an afternoon preparing, but the public may disagree with you. It is better to put the gif aside.

Creating Animated Gifs

So you’ve decided to try and create an animated gif, but where to start? If you have Adobe Photoshop, you can create animated gifs without much difficulty using the Timeline window. There are also several free online services that let you make animated gifs from a wide variety of file types with very little effort, however, most of these also attach their own watermarks to the gifs. Similar in functionality to Adobe Photoshop, Picasion is an online application that has a full set of editing controls and, most importantly, it doesn’t watermark the finished image.

Animated Gifs are a Spice

Animated gifs are a fun way to liven up your mailings and present information in a new way, but they also can have a numbing effect if they are used too often. A sprinkle of cinnamon on top of your latte is nice, but try eating a tablespoon of it. Occasional use of animated gifs can enhance a campaign’s appeal, but use them too often, or badly, and they will have the opposite effect. Also, never forget that engagement starts well before the first image is loaded. If the subject line isn’t compelling, or the recipient is indifferent to your mailings, it won’t matter how perfectly you’ve executed your animation. No one will ever see it.

2013: The Year in Email

2013 was an interesting year. 2012 ended with Oracle buying Eloqua, and 2013 ended with Oracle buying Responsys. Who will they buy next? 2013 began with Salesforce CEO Marc Beniot telling a crowd at CES that email was dead, and then turning around and buying ExactTarget a few months later. It was also the year that marketers finally got over their infatuation with social media after several reports showed that far-and-away the most effective digital channel for marketing is still email.

We’d like to take a look what landed in our inbox over the year. Here’s a round-up of some of the most interesting examples. Some of it is inspired, some of it is confusing, and some of it is just plain awful. Several of the mistakes shown here are things that can happen to any of us, but they stand as good reminders that email isn’t just about writing content and sending it—it is also about proofing and testing.

Alt Tag Fun

Ya’ got something against “T”s?

Alt tag goof

Lyris gets points for using a colored cells with reversed text, but if you ever needed a reminder to check your alt tags as carefully as you check your content, this is it. In Lyris’ defense, at least they had an alt tag. I can’t say the same for Hugo Boss, whose email always lands in my inbox looking exactly the same:

No alt tags

Slightly better—but only slightly—is J. Crew. Here’s their solution to the alt tag dilemma:

weak alt tags

Last September, for a week or two, someone who knew what they were doing must have taken over J. Crew’s email preparation, because suddenly the email was going out with actual, meaningful alt tags:

Good alt tags

Sadly, it appears to have been a blip on the chart. Within a couple weeks they were back to the generic “jcrew.com” alt tags on all their images.

You’re using an image because…?

It’s always heartening to see someone use alt tags to further their message. That can be anything from a simple “Turn on your images to see what you’re missing,” to fully styled alt tag in a colored cell (see The Finer Points of Styled Alt Tags for more on how to do this). But this alt tag from Generator Research takes the cake:

wordy alt tag

Bizarrely, the missing image is nothing more than this same list as a gif file, which raises the question: Why bother with the image at all?

Delivery Problems

Some problems are beyond the control of the sender. Network slow downs, unexpected glitches, and certain browser extensions can ruin the best email design. Here are a few examples of emails that were probably fine back at the office, but ended up a mess when they arrived in our inbox.

Text still rules

Bad image display

This is a great example of why you should always include text in your mailings. We’re not sure why this email from Fab got screwed up in transmission, but had they included some text it would have mattered less. As it stands, the only visible message is something about Pumpkin Pie Cake. Is it a product, a cookbook, or just a joke? I’ll never know because the only other text in this email were the legal notices, address, and unsubscribes mandated by the CAN-SPAM act.

WOT the heck?

WOT effect on display

There are a lot of sneaky pitfalls that can ruin the best planned email. This one from Slate might have been okay had they not decided to convert everything in their mailing into images. They were careful to include the “display:block” command with each of the image sections, but because I use Web of Trust (WOT) with my browser, each of the image segments is slightly displaced by WOT’s symbol insertion. Admittedly, this wasn’t entirely their fault, but their choice to use an image instead of a combination of text and images certainly exacerbated the problem. Had they used actual text for the message and separated the decorative elements from the images that need links this wouldn’t have happened. [Note: For more information on this topic, see our blog post Using Text to Deliver Your Message.]

Subject Line & Sender Disasters

The single most important pieces of text in your email are your subject line and your ‘From’ address. Before they’ve even opened the message, these things will say something about you, and if that something is not good, then it doesn’t matter if that mailing has the best, most persuasive content in the world, no one will bother to look. Here are a some rookie mistakes from people who should know better.

Call me dyslexic

This piece of email came from Digital Marketing News:

Misspelled name
Digital News Marketing = DNM? If you’re going to misspell something, try not to let it be your From address.

Who is ANSI_X3.4-1968 anyway?

ANSI text issue

You may have seen this subject line structure before. The problem is that the encoding didn’t match the chosen character set. The headline used an em dash (it should read: “EEC 2014—Early Bird Special Ends Tomorrow”) but for that to work, the subject line must be encoded properly. You’ll see this most often when using email-injector programs, such as the Javamail API included in Java, instead of the software from a professional ESP. Any decent email marketing software should be able to avoid this problem. But even a single test email would have exposed this problem, so testing cannot be overlooked.

We care, now go away!

Do Not Reply

In our blog post, Of Senders and Subject Lines, we talked about what a bad idea it is to use “DoNotReply” as a sender address. Somehow, it’s not surprising that it’s a phone company that makes this mistake, but the fact they did it on an email claiming that “your opinion matters” almost pushes this one into satire.

The Linkin’ Logs

There is one simple rule in email design: If you have a picture of a product, the link on that picture should go to that product. Sadly this rule is sometimes ignored. Some marketers cut down on links in hopes of improving their deliverability (there are better ways to achieve this), but it can lead to its own problems. Here a few examples of bad linking choices.

Look at this! Now try to find it!

Inaccurate links

Bed, Bath & Beyond was the first out of the gate with Christmas-based emails. Before the candles had gone out on the Halloween pumpkins, BB&B was sending holiday messages. This email forgets the basic rule that when you show a product, make sure that the link goes to a page that features that product. In this email, clicking on any of these items takes you to the main page as noted in the red tabs below the images. In all these examples, the products shown are not on the first page, and in some cases, don’t show up until the last page. It would have been a far better strategy to either show a picture of the first product in the section, or link to the actual products and have the red sub-tabs go to those main landing pages.

No links

Even worse is this email from H&M. Not only don’t the individual images link to the products shown, they don’t link to anything at all. The only link in this email is at the little “Visit us today” text below the image. Way to miss an opportunity H&M. The same goes for NuForce, whose layout suggest there will be links, and was almost custom designed for image-mapped links, but no links exist.

No links

Alignment Issues

Alignment can be tricky. Forget one “display:block” command and everything falls apart. But some things just don’t need to happen. Here are a few problem emails that came our way last year:

Why did the web designer leave the restaurant?

If you haven’t heard the joke already, the punchline is: Because there were too many tables. Web designers hate tables. A few years back, it was mandated that tables should be for tabular dated only and not for image and text alignment. For that, we were told, you should use divs. The only problem with this advice is that someone forgot to tell the email clients, many of whom have barely entered the 21st century when it comes to HTML compatibility. So what happens when you hire a web designer to create your email? Most of the time, it’s not that big of a problem, but there are tell-tale signs if you know where to look. For instance, here is the right edge of three images in an Andrew Marc email:

aminsider2If you look closely, you’ll see that this is slightly misaligned. It’s a very small issue, and clearly the designer decided it wasn’t worth worrying about, but there is really no reason for these images to be out of alignment at all. The designer is showing his (or her) web design background by stacking these images up in a div. A simple table would have eliminated the misalignment entirely. This particular email also contained a chunk of JavaScript—a big no-no in email design, and the white gaps between the images have a whiff of “I meant to do that!” about them.

Still, in the grand scheme of things, it could be worse:

Misalignment #1

Misalignment #2

Misalignment #3

Some of these suffer from the classic missing “display:block” problem, but not all. The Old Navy/Piperlime email at the top was the result of a 100% width assignment on the first cell, instead of the desired 700px width. This was obviously an oversight, but a test email should have caught it.

Microsoft strikes again

We don’t know what it is about Microsoft, but they certainly do like to make designing email a challenge. Every email browser they offer is different. On one hand, Outlook.com can handle more HTML5 commands than any other email browser out there, while Live Mail seems to ignore almost everything. A recent development with Live Mail that’s worth keeping in mind is the way it handles style information, and, more importantly, the way it handles sizing. Here is the visible portion of an email we received recently:

Oversized empty window

And here is the same email after we chose “Display Images”:

With images displayed

This happens if the image or cell has included width information, but not height information. Had this particular image include both height and width, the text portion of the message would have displayed in the window, improving its odds of being read.

Put Your Money Where Your Mouth is

Practice what you preach.

Nobody says email has to be pretty, but if what you’re trying to promote is “beautiful email newsletters,” then you’d better have something to show for it. This monospaced, bland message does nothing to enforce the idea that the author knows anything about aesthetics.

Ending on a Good Note

Not all email is bad news. Some email marketers are doing an excellent job of making email interesting an exciting. Here are a few examples of above average work from the past year.

Thanks for Subscribing

Thanks for subscribing

Everyone sends out some sort of alert to notify people that they have subscribed to a company’s email, but few make it as much fun as Upworthy. The great thing about this notice is that it makes you look forward to receiving the email instead of immediately regretting signing up for it.

Beyond Mosaics

Last Spring, we did an article here that covered the use of Mosaics. Mosaics are a way to use colored table cells to imitate an image. Most of the time, mosaics aren’t worth the effort because they can needlessly increase your email’s file size if you try to make them too detailed, and end up looking clunky if you make them too coarse. Pizza Express in England has found a better way to deal with it by using mosaics sparingly and making them just detailed enough to get the idea across. Here’s a beautiful example of their work from last Valentine’s Day:

Valentine's Day

Normally, the mailings from Pizza Express don’t get this complex, but they always use colored cells to make their email interesting whether you have images turned on or not. In the example above, for instance, the cells use a palette of blue, red, and black for their background colors.

Pizza Express pulls out all the stops for their birthday email design, which looks like this when the images are turned off:

Happy Birthday!

Not bad, but the design goes further by using an animated gif when the images are displayed:

animated gifNice work Pizza Express.

We hope you’ve enjoyed this look back 2013. Perhaps there is some schadenfreude in seeing the mistakes of others, but here are things to be learned: make your email visually interesting, but not at the expense of text, don’t neglect the subject line, in email, tables still rule, and—most important of all—test before you send.

HAPPY NEW YEAR!

Here Comes Santa Claus

Santa and List

I noticed this morning that Starbucks is already using their holiday cups (this was written in 2012, well before the current cup controversy). Everywhere, retailers are ramping up their Black Friday and Cyber Monday sales pitches in preparation for this holiday season. While some people are grousing about stores jumping the gun on Christmas music, others can hardly wait. There’s a certain optimism in the air this year. People are ready to shop again. Last year, Cyber Monday surpassed Black Friday in sales, so expect more email competition than ever this year.

This is, for many retailers, the most important time of the year for their email to get through to their clients. For some retailers, the holiday season represents up to 40% of their annual sales. On average, it represents close to 20% of annual sales. Email sending increases during the final weeks in October and really gets going in the weeks before popular sales events, such as Black Friday and Cyber Monday. Retailers increase their send volumes by 47% on average. As a consequence, email services such as Gmail and Hotmail also ramp up their efforts to eliminate spam by tightening up their restrictions and by requiring higher reputation scores for received mail.

So what does that mean to you? For most people, probably nothing. If your clients have been engaged in the past and you’ve never had any trouble getting your email into the inboxes, then the holiday anti-spam measures of the folks at Google, Microsoft, and Yahoo won’t matter much. But if your reputation score is already close to the edge of acceptability, you might suddenly find your email winding up in junk folders more often than it had a month ago. This also means it is very bad time of year to be experimenting with list purchases and appends. Now would be a good time to pull up your reports and look at your metrics. Do you have any problem areas? In the example below, everything sent to comcast.net is ending up in the spam folder. Since the other domains are showing good results, the next question becomes, how many of my recipients are using this service? If for instance, you are sending out 750,000 email and three are getting block by Comcast, then this isn’t much of an issue. If, on the other hand, Comcast received 500,000 of that mailing, then you better take actions to correct this ASAP.

Problem with Comcast

The sad truth is that if you haven’t been paying close attention to these metrics all along, by the time November rolls around you are probably much too late to do much to help turn things in time to help your Christmas sales campaign. Nonetheless, there are still things you can do to improve your email marketing efforts during this holiday season. Here are the main ones.

Making a list and checking it twice

This is an area where many businesses fall down every year. If a recipient opts to stop receiving email from you, sending that person your holiday specials will not be looked on kindly. In some cases, this isn’t the fault of the business, but of their ESP. Many email marketing systems require you to create separate lists for each segment you create. You create a segment of men over forty and that’s a list; you create another segment of women under thirty and there’s another list. If you are using email marketing software that requires you to create separate lists for segmentation and topic categories, your chances of resending to people who have opted out of your list are increased geometrically. You’ll need to go through those lists carefully and make sure you haven’t made this mistake. If you are using Symphonie, this isn’t an issue as unsubscribes are always respected, even across segments.

Too much of good thing

While it is unquestionably important to strike while the iron is hot, don’t overdo it. Even at a time year when people expect more sales-related emails, they don’t want to feel overwhelmed. People expect more email at this time of year, but how much you send needs to stay in proportion to your normal engagement. If you been sending notices a couple of times a week, then daily emails might be acceptable, but if you’ve only ever send a recipient one email every two months, the sudden appearance of daily emails might cause the recipient to react negatively. It is far better to send a few emails with compelling sales pitches than tons of mediocre ones. By keeping close track of your metrics, you can correct these potential problems before they occur. If your opens and clickthroughs are showing dips when they are sent too close together, pull back on the sending a bit and see if that helps.

Subject lines are more important than ever

Since everyone is getting more email now than at any other time during the year, more email is being deleted before it is ever opened. People decide in an instant whether they want to read your email or not, and that decision is based almost exclusively on the subject line. If you fail here, it won’t matter how good your content is. Like the first sentence in a story, the subject line should intrigue the recipient enough to keep reading. If you aren’t doing so already, this is good time to use A/B splits to test various subject lines for their response rates.

Make it mobile friendly

These chilly winter evenings, people won’t be home in front of their computers, they will be out shopping and visiting friends. Many of these people will forgo reading their email on their desktops in favor of reading it on their smart phones. Products like the Apple iPhone, the Samsung Galaxy phones are changing the way people connect. Everyday, more and more email is read on smart phones instead of desktop computers. If you are designing your email to be read on nothing less than 17” monitor, you are in danger of losing sales from people who find your email too small to read on their Droids. One popular solution is responsive design, which adjusts the email’s format to match the size of the screen, but many ISPs still do not support this. Even if you do plan to use responsive design, make sure that your email is legible on a phone without it. [Note: For more on this topic, see our four-part series on responsive design.]

Last minute is often too late

You may have an idea of the exact time that you want people to receive your mailings, but keep in mind that most ISPs will begin to greylist more email as the volume of email increases over the holiday mad rush. They do this to manage their loads and slow down those senders without stellar reputation scores. But if the delay is long enough, it can mean that your email won’t land in the inbox until it’s too late. Your ESP should offer a feature to stop delivery attempts if the email isn’t delivered by a specific time.  There have been cases of one-day-only sales appearing in mailboxes the day after the event. Give your recipients a few days head start.

Get personal

People are far more likely to read your email if they feel like you are talking to them personally. Don’t neglect to use your merge and dynamic content features to make each email seem like it was hand written expressly for that recipient. For more on this topic, see Personalizing Your Email Marketing.

In summary, here our checklist of things to keep in mind as you send out your holiday emails:

  • Is your reputation score satisfactory? If not, contact any ISPs that presents problems to resolve this issue.
  • If you have multiple lists, make sure all the global unsubscribes have been removed from those lists.
  • Sending more email is okay, but don’t overdo it.
  • The subject line is more important than ever.
  • A/B test whenever possible.
  • Always allow enough time between a mailing and a specific date to allow for possible ISP greylisting.
  • Personalize the email with dynamic content when applicable.

Do these things and your email should arrive on time in the inbox and ready for the season.

Happy Holidays!