CSS 3 and the pulsating glow button

Although support for CSS in email clients is patchy at best (and a nightmare at worst) we can still use some of the newest features provided by CSS3 as long as we can provide suitable alternatives for the less capable inboxes.


Here is an example of a special call to action that will not only animate but also display fully even when images are turned off.

How it’s done

This CSS must be placed in your html documents head as internal CSS it will not work if it is put inline. Vendor prefixes have been used for the gradient to ensure it displays in iCloud Mail no matter what web browser is used. The animation will only work in iOS devices so I have only used the -webkit prefix.

The HTML for the button <a> must sit within a table cell to fix a padding bug in Outlook. I also included much of the CSS for the button inline to ensure the colour, border and text would be formatted correctly even in less capable email clients.

A note on support

This code will not display the same in every inbox.  It will create a button of roughly the same size but the animation and other style features will change across different email clients.

iOS5, iCloud Mail
CSS3 border-radius, gradient & box-shadow. Animations work!




Thunderbird 9
CSS3 border-radius & gradient


Gmail, Hotmail
CSS3 border-radius & background colour

Outlook 2010, Yahoo! Mail
CSS3 border & background colour



The point worth mentioning is that even though Outlook and Yahoo are a bit pony it is still a good looking table button rather than an image button so it will be visible whilst images are off. Also the benefits of the curved corners and the gradient in most other inboxes + while the images are off, will help make the email look “shexzier” … Jordie 😉

Personally I think it is worth the trouble to get the buttons looking as nice as possible, but yes, the pulsing glow might be a little over kill for the effort for every button, so save it for the main call to action or something novel to attract attention in the same way as you would an animated gif.

Recent Deliverability challenges & getting in the inbox

[tweetmeme source=”getintheinbox” only_single=false]

Deliverability is always a hot topic, often due to its immense ambiguity.

Working or an ESP where I make it our business to know about this and have produced blogs, guides, infographics and webinars on the subject to continue with our part in “Improving Results together” but it is a consistently evolving area and recently Inbox Placement has got a little harder again.

Some of you may have noticed increased junking or delayed delivery to the big four consumer email providers: Hotmail, Yahoo, Gmail, AOL on and off since the start of the 2012 this is down to changes that have been going on in email this year.


You may have heard that Google has been rolling out updates to Panda this year, they have also been rolling out updates top their junk filters on Gmail.

Gmail has always been more responsive to their users’ activity with their emails as per their Priority Inbox and Smart Label tools.

Recently Gmail has started to tell us why an email is in the junk folder. This appears to have increased the sensitivity of their filters to further increase the priority of emails which each user has shown positive engagement with. As a bi-product emails with less positive engagement has found itself increasingly junked.

The two most common false positive reasons I’ve seen are:

  • It’s similar to messages that have been detected by our spam filters
  • We’ve found that lots of messages from [email] are spam

Some of the false positives include Gmail’s own Calendar reminders.

However the change occurred senders want their emails back into the inbox, so there are a few things you can do to help them on their way and to increase your reputation with Gmail:

  • Ask for white listing
    • Ask your recipients to add you to their contacts list
      Being in the address tells the inbox provider that the sender is a trusted contact, so it has an easier time getting to the inbox.
  • Ask for images to always be loaded
    • Images are blocked for security reasons, so telling the inbox to always load the images is a sign that it is from a trusted sender.
  • Invite replies
    • Once someone has replied to an email twice, Gmail will auto-load the images from then on, knowing that their emails are from a trusted contact due to the conversation.
  • Get Forwarded
    • As you may have heard, send to a friend is kind of dead and sharing emails to social media rarely done by recipients. They will forward the emails and share the landing pages.
      So the inbox knows that if you are forwarding an email to one of more people, you are most likely to be sharing good and interesting content that is not only relevant to you but also so remarkable you are sending to other people because think it will be relevant to them.
      This is a good sign and helps reputation
  • Get marked as not spam
    • If you are in the junk folder and a recipient goes in and marks your email as not junk, that is the loudest noise someone can say about it.
      They are telling their inbox that they have made a false positive and not to do it again.

The best time and place to do this is at the point of sign-up on the thank you landing page.

There’s no shame in asking people to check their junk folder for the email. Tell them the from name, tell them the subject line, ask them to safe list it. Then in the email ask them to load the image images. This is the point where they are very engaged and are most likely to do these things, so make sure you ask them.

Yahoo & AOL

Historically Yahoo was the first of the old Big Three (Hotmail, Yahoo AOL) to publically adopt reputation monitoring but the only recently got a feedback loop, whereas AOL and Hotmail have had one for a very long time.

Historically AOL had the largest and for many people, the best email support with the largest postmaster team.

However, with technology being able to do more and more postmaster teams have shrunk significantly and free inbox providers are less engaged with the bulk marketing senders and more on their users, who essentially pay the bills, which is understandable.

This means that senders have to work harder to stay in the inbox, they have to stay relevant, make clean emails, design with mobiles in mind and most importantly collect addresses organically through sign-ups rather than purchase or forced and sneaked opt-in.

Spam Traps

This year, a lot of new spam traps were created by inbox providers and spam protection agencies like Spamhaus.

Some of them are not the typical traps to catch scrapers either, a fair few of them were “zombie traps”; these are addresses that have been dormant for over 10 years.

They may have signed up for emails over 10 years ago but have not, apparently, taken any actions with an email for 10 years until recently, when they have been blocklisting people.

They have all done exactly what they are there to do: catch people who are not cleaning lists properly or people who are buying lists, particularly old lists of very poor quality, possibly even scraped.

At the same time the importance of avoid spam traps from the free inbox providers seems to have increased, thus reducing the reputation of senders hitting them even more.

So it is vitally important that your data acquisition process is safe, if do anything other than an explicit opt-in to your brand, ensure you can track the address back to the owner filling out a form in the five years. If you do any affiliate or co-reg work, make sure people are not being forced to enter an address for no relevant reason and that your partners can prove to you the sign-up was from the owner in the last 5 years and they know what was going to happen.

Sending Speeds

One of the biggest reactions to poor reputation from a large inbox provider is to reduce the amount of email they will accept from you in a short space of time.

So if you are experiencing junking, try sending slower.


Another symptom of poor reputation is less tolerance of content. By changing your creative and trying to reduce potential spammy phrases, you could find yourself back in the inbox. Common tolerances include: “% Off”, “Sale”, “Discount” etc. Also: anything about winning and financial aid like loans, approval etc.

This would then get you back in the inbox where your preheader could ask for ‘always show images’, ‘add to contacts’, ‘reply to this email with any feedback or questions’ etc. then as your inbox placement increases you will have more freedom with your content.

Senderscore Certification

Our partners ‘Return Path‘ have some cracking tools on measuring and assuring deliverability as well as a very effective anti-phishing tool.

As far as getting emails delivered is concerned, if you are Senderscore Certified you do not have any volumes throttling to providers like Yahoo and Hotmail and your images load automatically upon opening the email.

The service is not free but not expensive and when you see the inbox placement results you’ll see it’s worth every penny.

It’s not available to everyone, only full organic opt-in senders are likely to qualify but we and Return Path together can offer the support and advice you need to achieve Certification and make deliverability issues far less of a consideration.

Originally written for Pure360 “Deliverability challenges & what to do to get in the inbox

Above the fold – two emails in one

[tweetmeme source=”getintheinbox” only_single=false]

Above the Fold?

You may have heard the phrase above the fold in more than one context, in this context, I am talking about the section of the email that is visible when the email is first opened;

In Outlook, Thunderbird and Gmail, for instance, this is the preview pane (if you have it enabled); on all other inboxes, without a preview pane it is simply the content that is first visible. This will different for each inbox and the top of the email will be positioned at different places on the screen, eg: Outlook’s will probably be nearer the middle, whereas Hotmail will be higher on the screen.

So that bit of the email is the bit above the fold.

Two Emails?

When someone gets an email there are 2 initial touch points: the inbox view where they see the ‘from name’ and the ‘subject line’ (plus the inbox snippet preview on the iPhone and Gmail etc.), then the email itself when they open the email.

They then have to decide what to do depending on their impression of the content in front of them and their opinion/rapport with the sending brand.

This means is that that rest of the email ‘below the fold’ is not visible at all at this point and one of the decisions the recipient has to make is whether or not to scroll down.

Other decisions include: load the images, view in a browser, click through etc.

Once someone has gone as far as scrolling down the email, you should be able to fairly safely assume that the images are already loaded so there would be fewer barriers to engagement with the content at that point.

Subsequently the content segment that is visible to the recipient upon opening could or should be looked at differently than the rest of the email or more importantly more than the entire email as a whole.

Content above the fold needs to achieve the initial engagement, based on the goal of the email.

  • If the goal is to do one thing, it should hold at least one call to action.
  • If images are present and especially if an image plays a particularly important part in the conversion, it must get the images loaded or the browser view link clicked.
  • If the email is fairly long it would also be responsible to getting the scroll, so it should tease towards content further down the email as well.
  • To ease future engagement, why not ask for images to be always loaded?

Once the engagement is achieved, you have far more of a free rein over your content and you can then take the recipient down the path you make for them.

I originally wrote this for Pure360: “Above the fold – two emails in one

– – –

There is also another very cool blog on Email Critic called: “Email Marketing Above The Fold: Four And A Half Things To Include” which also mentions adding an unsubscribe link. I’m all for it if you are having problems with spam complaints and/or if your rapport with your audience or your audiences’ rapport with that email is poor. In those situations people might find themselves moving the mouse towards the spam button in order top optout without registering a click with the email.

Having an unsubscribe link in the top right of the email means that the user will pass that link on the way to the spam button in many inboxes and might just hit that instead and save you from complaints. This will help your reputation, or at least lessen a negative affect.

If you are not having a complaint problem by putting an unsubscribe link in the top you could make it easier for some of the lesser engaged people, who might be on the way to being zombies, to optout, meaning you will lose the ability to convert them later. Instead you should be segmenting your list by engagement, so people who are less engaged can have content and a call to action that is more suited to that rapport.