Blog

As you (and probably your wallet) know, this is the season for giving, as well as reflecting. So while the tinsel gets taken down for yet another year at Campaign Monitor -sponsored Xmas events like WebBlast Sydney, lets look at some of the events we've supported via our Giving Back Program and hopefully, get you involved in the year ahead.

Our Giving Back Program has supported dozens of web design and development events for close to three years now, plus offered free accounts to select email senders. So if you're running an event in the new year that you think could benefit from pizza, beer, a tweet-out and free email credits on us, it's a great time to get in touch.

What kind of events do you support?

Since our first event in 2009, Campaign Monitor have powered our email newsletters and helped cover our running costs. We don't advertise, so it's only through word-of-mouth and email that we can spread the news. We wouldn't be able to run Ignite Sydney without their support.
- Stephen Lead, Ignite Sydney

Our Giving Back Program is all about returning the favor to the web designers and developers who have stood by us since Campaign Monitor's humble beginnings back in 2004. Since the Program's launch, we've had the pleasure of getting behind events that resonate with us and our customers, including Semi-Permanent and both Refresh and Ignite internationally. We even power newsletters for SXSW... And attend!

That said, you don't have to run a high-profile conference to qualify - smaller design-focused gigs like BAMMD and user groups like EEUK very regularly get a hat-tip from us.

How can I get involved?

If your event could benefit from a free Campaign Monitor account, a modest bar tab (like our friends at the Portsmouth Freelancers Meet, pictured) or email credits as a door prize, let us know and we'll be sure to give it a look. We're especially keen to visit your website and get the lowdown on previous events, so be sure to pass on those details, too.

Finally, a huge thanks to everyone who has invited us to support their gathering, or attended an event that we sponsored this year. As the Giving Back Program continues to gain momentum, we're looking forward to enlivening more design nights, dishing out more pizza and giving more to people like you.

We're keen to explore other meaningful ways we can give back to the web community, so if you have a suggestion as to how we can make a positive impact on what you do, from providing more design resources, to getting the word out about your design meetup, pop us a line, or let us know in the comments below. All of us here are looking forward to making 2012 an awesome one for you and your clients!

With only a few days to go before Christmas, I suspect a few of you are scrambling to get your campaigns out before we all tune out for the holidays. So we've collected some of our favorite seasonal campaigns and ideas in a last-minute holiday email round-up, to get you fired up during this last sprint. After all, it's not too late to create and send your email greetings, especially when using our template builder!

But that's not all - we've also got an easy-to-use 'Season's Greetings' email template, free to use and tweak. Plus, if you send a holiday-themed campaign in December, you will also go into the running to win our annual holiday email competition, so hop in your sleigh and go!

Nine inspiring Christmas email designs by our customers

From animated GIFs to pixel art, here are some of our old and new favorite Christmas email designs, including a template builder creation by Tangelo, tees by Threadless and image-free pixel art by Style Campaign. Click to view these campaigns:

Thinking it may be too late to send your own design? Up next, we have an email template that you can load up in your account to share the love.

Send a sprinkle of snow with our holiday email template

Last week, we added a charming 'Seasons Greetings' design to our collection of 100+ free email templates. Featuring pure CSS animation and rock solid email client support, it's great for sharing a sprinkle of holiday cheer!

Even if you caught it back then, it's worth getting the refreshed version for the recent updates, including smoother snow in Chrome and snow in Firefox. With hardly a day to lose before Christmas, it's time to get started on your holiday campaign!

Finally, our holiday email competition for 2011

As is our tradition at this time of year, we've got a sack-load of goodies to give to our customers in our annual holiday email design competition. One lucky winner will receive a:

• Kindle Fire *
• FitBit Ultra, or ~ $100 to back the Kickstarter project of their choice
• 50,000 email credits

* For non-US customers, we can arrange an alternative prize

In addition, 3 runners up will receive a prize of 10,000 email credits each. That's a lot of free emails to kick off 2012!

How to enter win

To go into the running, simply send a holiday-themed campaign during December - if you have already, then you're in it to win it! Our team will be sifting through and shortlisting Christmas campaigns as part of their regular review process, then selecting our winners in early 2012. If you've got an outstanding campaign that you think should make the cut, you're welcome to send us a link, too!

Finally, we're not looking for Hallmark card tackiness, just technically and visually awesome HTML emails. If your email campaign displays nicely across the major email clients, has a few mobile optimizations and is an actual email design, not an awkwardly resized website, then there's a great chance that it will be shortlisted. Image-only emails may look nice at first glance, but aren't likely be chosen by the guys and gals here.

Now we've got you inspired, templated up and motivated, it's time for you to crank out those end-of-year campaigns - good luck and happy sending!

When optimizing HTML email for mobile, it's really easy to get overwhelmed by the CSS trickery and technical stuff and simply put it all in the too-hard basket. But the truth is that some of the most effective techniques are also fairly simple - such as adding a good preheader to your campaign.

A preheader (otherwise known as a 'Johnson Box', haw haw) is the the short summary text that follows the subject line when an email is viewed in the inbox. Many mobile, desktop and web email clients provide them to tip you off on what the email contains, before you open it. Here's an example in Gmail:

Generally this line of text (in this case, 'Wishing you a safe and merry holiday season!') is borrowed from the first text found in the email campaign. On mobile clients in particular, the preheader can mean the difference between someone opening your email and archiving it - so you generally want it to be something meaningful. Like a summary of your offer, not your campaign's webversion message or the remnants of social sharing links. Because believe it or not, they work. From our friend, Elliott Ross:

"In my experience we’ve implemented it (preheaders) on a number of campaigns and it’s raised open rates, click thrus and reduced spam complaints."
- "The Perfect Email Preheader/Johnson Box", Email Design Review

A lot of designers make their preheaders very visible by adding a short summary to the very top of their designs, but personally, I like to hide my preheaders and forget about them altogether. Lets go through the nitty gritty of how to do this.

Adding a preheader to an email campaign

The first thing to ask is if you have to worry about a preheader at all. For instance, if your email already cuts to the chase and the first text that appears does a good job of summarizing what's to follow, then you may not have to add one. But for the rest of us, a little bit of text just after the <body> tag in your HTML email code usually suffices:

If you're like many senders that add a nice visible summary, you can stop here and style it up all you like. But as I mentioned earlier, I prefer to hide mine:

The above still displays in Lotus Notes - if this is an issue, try adding font-size:1px; to the .preheader styles, and/or using the same color for both the text and background.

Automatically adding a meaningful preheader with our email editor

The major downsides to using the above preheader technique are:

1. It's easy to forget to update the preheader text
2. When using templates, customizing the preheader for each campaign is a lot of hassle

Cool customer Mark Shingleton came up with an ingenious way to ensure the preheader in his campaigns looks good each time - adding a table of contents to the top using our template tag language:

Not everyone can make the design decision to place a table of contents at the top of their campaigns, however if you or your clients are using the email editor to build campaigns, you can use the text that is automatically generated by a combination of repeatertitle="true" on headings and <tableofcontents> in our template language to fill the <span> tags we were using earlier:

What you'll end up with is a preheader consisting of headings from the articles in your email campaign (pictured).

The beauty of this is that it's totally set-and-forget - your clients can take a template and add articles in the email editor, while being totally oblivious to the whole preheader thing. But the downside is that you can only add one table of contents to your campaign (sorry!), so you either feature one in your design, or use it for the preheader.

Update: It turns out that we posted about an alternative method for adding preheaders - using the alt attribute in a 1x1px image - back in 2006. You can't use this method to autofill the preheader with template tags, but if you're manually adding one, check it out.

Now, I'd love to know how you use preheaders - are they important to you? Do you have a particular technique that you use in your email campaigns and templates? Let us know in the comments below.