What’s in my inbox?

Recently I received this clever email from Ann Taylor. It’s a simple short sale promotion but the design and use of animation really made it stand out. The design is very simple but the idea of an input field really enticed me to click, almost expecting that I’ll be able to type something and click “GO”. Of course that’s the simple beauty of it. There’s no need for a “shop now” call to action.

Another creative email I received was this re-engagement message from Urban Outfitters. The text message theme is very clever and the overall design fits right in with their usual off the wall style. I like how the two calls to action are integrated into the text conversation. One of them is actually an unsubscribe link. It may seem counter-intuitive to reduce your list size. However, sending emails to subscribers that want to receive your emails will produce higher click-through rates and increase your ROI.



Email Design: Breaking the Rules

Recently, I received an interesting email from J.Crew. It’s in some ways unconventional and goes against one common best practice. Best practice would tell you the call-to-action should be “above the fold”. “The fold”, however, is an antiquated term and hard to define in today’s email universe. You can basically translate this to saying that the call-to-action should be visible without scrolling. This is a bit tricky considering the various monitor resolutions, tablets, and smart phones people view their email on. As a designer, this can be frustrating because if you truly stick to this best practice it can cause some limitations in your design. What I like about this email is the fact that it doesn’t follow best practice. There’s no clear call-to-action initially — you have to scroll down to see it. What this email did was make me curious. Not only did curiosity make me scroll down, it made me click to “find out why”. Now, I’m not saying throw caution to the wind and ignore best practices. They’ve been established for a reason. What I am saying is its ok to shake things up and break the rules now and then.



Gmail Grid View

In case you’re not aware Gmail is currently doing a field trial that allows you to view image previews of promotional emails. It’s referred to as the grid view. I signed up for the field trial and it’s definitely something retailers will want to take advantage of. There was however an issue I noticed. Some of the emails did not have an image preview. With a little research I discovered there are a few things that can cause this problem. This article at FreshInbox provides some helpful information about fixes for the issue.



Mobile First Email Design

A little over two months ago Lane Bryant began sending emails in a slimmer format. They changed the overall width of their emails from 640 pixels to 480 pixels. This change is not limited to Lane Bryant either. This is a trend you’ll see with many other retailers. So what gives? It’s no secret that email opens on mobile devices is a big deal (currently about 50% are opened on a mobile device). This is another shift toward mobile friendly email design. Slimmer emails with larger text sizes and fewer navigation links are all practices that make email mobile friendly. This is not necessarily responsive design, it’s a “mobile first” mentality. I expect to see more retailers embracing this in the future.


Lane Bryant is also including mobile signup in the email footer. Engaging customers via SMS messaging is something that isn’t talked about much as it should be. If you have the capability it’s definitely something to consider.  Customers that trust you with their phone number are typically your most loyal customers.




Black Friday Email Creative

When I logged into my inbox Friday I expected to see a lot of black and I wasn’t disappointed. Black is naturally the go to color for Black Friday creative. However, when everyone is using black, how do you make your creative stand out in the crowd? Let’s take a look at some examples that did just that.

First let’s look at some examples that get lost in the sea of black. These examples from Staples and Fab are representative of the average Black Friday email creative. Not bad by most standards but they don’t exactly stand out.

This example from American Apparel uses black. However, they’ve created an eye catching contrast by using black elements on a light background. By using plenty of whitespace they’re able to really make the bold text and image stand out.

J.Crew uses a splash of red to create high contrast. The use of a bright red sweater in this example really makes it pop. I also find it interesting there’s no mention of “Black Friday”. Instead they call it “The gifts, gifts, gifts! Event”.

Coldwater Creek chose to use black as an accent color. It still references Black Friday and uses the color black but red is the featured color here. All that red combined with black and green accents give the email a nice seasonal feel.

Tiger Direct used an animated ticker in their creative. Animation is a good way to draw attention. In this case it also helps emphasize the limited amount of time you have to take advantage of the sale.

Another way to stand out is to avoid using black at all. This email from Nordstrom is full of bright colors which help it stand out. Barring the dotted border they completely avoided using black. They could have used black for the text “BLACK FRIDAY” but instead chose gray.



Considerations for Smartphone-Friendly Email Marketing

I recently spoke with Website Magazine about seven things to consider when designing email for mobile devices. You can read the full article here.



What is and what could be - A responsive design experiment.

For quite some time now GAP has been sending emails that are 832 pixels wide. While most desktop resolutions can easily accommodate this width, without responsive design this would still be considered best practice. That being said, I thought it would be an interesting experiment to examine one of their emails and see how it could be made responsive. Below you’ll see how the email currently looks on a smart phone. You can see how the content is hard to read. You could easily mis-tap an element in the layout causing you to be directed somewhere you didn’t intend to go. The bottom line is this is not providing a good experience for the recipient.


Here’s what the email could look like on a smart phone with a little responsive magic. You can see how elements are much easier to read and the message is much clearer. By removing certain elements in the layout you can cut the clutter. This allows you to narrow it down to what is most important. Notice how the navigation has been narrowed down to two items. This makes everything easier to tap. This layout would greatly improve the overall experience for the recipient.




Nice example of an email series

Recently I received a series of seven emails from J. Crew. The series started on Monday and I received one email a day for seven days. The promotion was fittingly called “7 Days of Summer”. There were a few things I really liked about this campaign. Each day the sale was different. The design of the email was also a little different each day yet had a nice consistent feel. Below the navigation there was a progress bar where the day of the week was highlighted with a hand drawn circle. The use of hand drawn text in the design was a nice touch as well.

Email series can be applied to almost any holiday or event throughout the year. With the holiday season quickly approaching it may be something worth thinking about. “12 Days of Christmas” or “Countdown to the New Year” are just a few examples that could make a nice email series.



Responsive Design: A Few Simple Questions

In case you need more proof why responsive email design is important, take a look at this non-responsive example and ask yourself a few simple questions. Is this email easy to read? What is the call to action? Is this email providing a good experience for the recipient? Odds are your answers are no, I’m not sure and no.



Remember the preheader message.

Best practices for the preheader area in email tell you should include two things – a message to support the content of the email and a link to view the email in a browser. While the browser link is important, a supporting message is arguably more important. In Outlook, Gmail and the iPhone, the preheader text is displayed following the Subject Line. Since the iPhone holds 23% of the market share for email clients this is certainly something that should be taken advantage of.

Let’s take a look at two examples.

American Apparel

Subject Line:
KESH x American Apparel: The New Limited Collection

Please click here if you are unable to view the images.

This email from American Apparel doesn’t include a supporting preheader message. Instead, they’re using the space for a browser link only. Kudos for including a browser link, but as you can see on the iPhone preview, they’re missing out on an opportunity to better communicate the message.





Subject Line:
Casual Summer Clothes + The 4th of July Sale Is On

Kick Back With Summertime Clothes From Icebreaker, The North Face, prAna, & More ›

This email from Backcountry.com is a good example of best practices. There is a nice supporting message in the preheader as well as a browser link. Notice the preheader message is on the left and the browser link is on the right. Positioning is important. In order for the preheader text to appear after the subject line it needs to be the first instance of html text in the email. Positioning the preheader message on the left side ensures that it’s the first instance.