Browse by...
Home Resources Blog

Blog Post

33 Brand New HTML Email Templates!

Today we’ve uploaded a hot new set of totally free templates you can use for your email campaigns. If you’ve read our reports on CSS support in email clients you will know that it can be very tricky to get an email looking good in all the major programs. You may remember that we have previously released a set of free templates. With those designs, what we tried to do was stick as closely to clean, semantic code as possible. In doing so we made compromises in the design consistency in order to keep the code easily editable. While that was fantastic for many designers, who took them as a base and built up beautiful designs on them, for others it was a bit frustrating. We heard some feedback that you were expecting designs which varied less between different mail programs. So this time we’ve changed our approach and gone all out to get the rendering as close as possible in everything from Outlook 2007 to Thunderbird. That means using HTML and CSS that’s more complicated than before, and a little trickier to edit. If you do make changes, make sure to re-test before sending! We’re not saying the design will be 100% the same in every email client; sometimes there are limitations that can’t be worked around. You will find that they are pretty close, most of the time, and always end up looking good. We think you’ll love the visual impact of these designs too, as we’ve added some more personality and character to the new layouts. Each template comes complete with its original Photoshop file which you can use to edit the graphical touches. If you’re a MailBuild user too, then you get double benefits, because we’ve also included a version with MailBuild template tags built in, and they even take advantage of the new multiple repeater functionality. So visit the templates page now and check them out!

Blog Post

DomainKeys and SenderID on CPanel Systems

Setting up DomainKeys and SenderID is well worth doing as a way of authenticating your emails, officially nominating Campaign Monitor as an authorised sender for your domain. However, it can be a tricky process because it relies on DNS changes being made, and every host and DNS provider seems to use a different method. We’ve listed guides for a few specific providers already, but today’s guide covers a multitude of hosts who use a recent version of CPanel to administer domains. How to add authentication records to your CPanel domain First off, a big thank you goes to Campaign Monitor customer Brad Schmidt for providing these instructions for us. Adding SenderID Select DNS Functions, Edit DNS Zone Select domain you want to edit. In the first field, put yourdomainname.com. (be sure to include the trailing “.”) Select TXT Enter the SenderID value in right field, which you can get from your account. It looks like “v=spf1 mx include:cmail1.com ~all” Adding a DomainKey In the first field put: cm._domainkey (this time there is no trailing “.”) Select TXT Paste your key from your account into the right field The quotes around the text may be added automatically for you, or you may have to add them in – we’ve heard conflicting reports, so just check what happens when you save. It should look like this: Now go to restart services Restart the DNS Server (Bind) That’s it! You may have to wait a few hours for the DNS changes to propagate, but eventually Campaign Monitor should be able to verify that your records have been added. Make sure you have clicked the ‘I’ve added the records, verify them for me’ button in your account too.

Blog Post

Email Standards Project: Test Your Email Client

Over on the Email Standards Project blog we’ve posted about how you can get a copy of our email ACID test sent to your own email address. That means you’ll be able to check how our base test renders in your email client of choice. We’ve heard from a few developers of smaller email clients, and this is a great way to compare their rendering prowess to the big market players. So jump over to the “Want to test your own client?” post, and add your address if you are interested.

Blog Post

Using Conditional Comments to Target Outlook 2007

The clever team over at SitePoint recently discovered a neat way to target Microsoft Office, and most importantly Outlook 2007 using conditional comments in your CSS. For those new to the concept, conditional comments are a Microsoft only technique historically used to target specific versions of Internet Explorer. For example, you can write a separate set of CSS rules that will only be applied to Internet Explorer 6. You can read all about them and see examples here. Importantly for us email designers, James Edwards from SitePoint has discovered that using the following conditional comment, you can actually target Outlook 2007. <!--[if gte mso 9]> // This CSS will only be seen in Outlook 2007 <![endif]--> Why would I use this? Most of the time you probably wouldn’t. As Mat recommended back in May, you really should be coding your email newsletters using tables and inline CSS to get the best results across the board anyway. This approach generally leads to a good result in Outlook 2007 without the need for special hacks (see exactly what CSS properties and selectors Outlook 2007 supports here). However, there are plenty of times when every email client plays nice with your design, but for some reason Outlook 2007 just won’t come to the party. We see plenty of examples of this when helping our customers with coding issues. If you’re in this frustrating position, this conditional comment method is a handy way to add Outlook 2007 specific code to try and fix the rendering issue without messing your design up in all other email clients. An example of the method in action To illustrate how handy this technique can be, I created a simple test email shown below. If anyone has tried to design an email with unordered lists , you’ll know that Outlook’s support is shaky at best. Here’s the code for my test: The CSS <style type="text/css"> ul { margin: 0; padding: 0; list-style-position: inside; } ul li { font: normal 12px arial, helvetica, sans-serif; } </style> The HTML <p>Here is a list:</p> <ul> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ul> The screenshot on the left is how my email rendered in Outlook 2003, and on the right in Outlook 2007. As you can see, Outlook 2007 refuses to show my bullets, whereas Outlook 2003 (and all other email clients) show them just fine. Using the conditional comment, I’ll add some extra CSS for Outlook 2007 only that fixes the issue by adding an additional left margin to the unordered list. The updated CSS with conditional comment <style type="text/css"> ul { margin: 0; padding: 0; list-style-position: inside; } ul li { font: normal 12px arial, helvetica, sans-serif; } </style> <!--[if gte mso 9]> <style> ul { margin: 0 0 0 24px; padding: 0; list-style-position: inside; } </style> <![endif]--> With the new Outlook 2007 only CSS, I get the following results. Notice that the bullets are now visible because it recognizes the conditional CSS and applies the required left margin. Impact on other email clients When running these tests I also had a look at the impact of the conditional comments on other email clients including all flavors of Outlook, Gmail, Yahoo! Mail, Lotus Notes, Thunderbird, Apple Mail, Hotmail and AOL. From what I could gather, they didn’t have any negative impact on these clients, but I recommend testing against them with your version before sending. While the unordered list bug was the first example I could think of that would take advantage of this hack, I’m sure there are plenty of others. I think it’s also worth echoing that this certainly isn’t something you’ll need to use all the time. But, for those odd occasions that Outlook 2007 is making life difficult, this could just be your saving grace.

Blog Post

Body Background Images & Outlook 2007

Adding background images to email? We’ve already done the hard work for you. Check out Stig‘s ‘Bulletproof Email Background Images’ code generator at emailbg.net I’ve been hard at work getting the next round of templates ready for mass consumption and stumbled upon something I could have sworn wasn’t possible. My background images (on the body) were working. Uhh, huh? I glanced across the office and asked Mat if this was something he knew about and simply never told me but he was just as surprised as I was. The bit of CSS that has proven itself effective in Outlook 2007 is: background-image: url('http://www.abcwidgets.com/bg.jpg'); background-repeat: repeat-y no-repeat; background-position: top center; background-color: #d9c092; Now the key difference with this and every other bit of CSS code I’ve ever written was the background-repeat. In the past, I would use solely: background-repeat: repeat-y; And while every other client seems to gracefully assume no-repeat for the repeat-x, Outlook 2007 does not. Stick that in and boom, you have body background images working. I gave this a go with some other elements (like divs and tables just to make sure we weren’t all going crazy) and background images definitely only work on the body and otherwise don’t display.

Blog Post

Our HTML Email Research Roundup

If you are relatively new to Campaign Monitor, or you don’t always follow the blog, you might have missed some of the HTML email support research we have done in the past. Here are links to our most popular posts on some tricky facets of HTML emails: What CSS is supported in email clients? (just updated for 2008) Does Flash work in emails? Can I use forms in my emails? Which clients block my images? Do animated gifs render in email clients? Will image maps work in an email? You might be able to save yourself a lot of time and hassle by visiting these pages next time your client has an odd request. If there is other technical support issues for HTML email you’d like to know about, just leave us a comment below. We’re always looking out for more useful information we can provide to make at least the technical side of HTML emails easier.

Blog Post

Differing Approaches to a T-Shirt Newsletter

The Freshview team are big fans of t-shirts, so much so we even have Campaign Monitor shirts available. So we’re always on the lookout for cool new shirts, and the local postal workers must get sick of delivering shirts to us. HTML email newsletters are a great way to publicise shirts because having a picture of a great new shirt delivered directly to your inbox is an instant stimulus to buy. Of course, the classic example, and one I use in my talks and articles often is Threadless. The SkinnyCorp guys are long-term Campaign Monitor users, and their newsletter for Threadless is hugely popular. Here’s a recent example: It’s very focused on the goal of showing you which new shirts are available this week and is instantly scannable. We love it! This is not the only way to go, though. Recently I read a comment from top designer Khoi Vinh about another t-shirt newsletter: For fans of the more popular, generally excellent, community-driven tee-shirt site Threadless, you may already be finding similar amusement in their regular sales newsletter, which more brazenly hocks their latest wares. The Rumplo newsletter, though, is much less hard-sell, and feels more expansive in its culling from the most obscure corners of graphic tee-dom. In a way, it’s very much a weekly review of what’s happening in this hidden-in-the-open medium. As it turns out, Rumplo has sent out some great emails recently. Here’s the most recent edition: Design wise it is not hugely different, but there is certainly less of an emphasis on buying, and more on exploring. That works well for Rumplo. Campaign Monitor seems to be a haven for t-shirt sellers actually – a quick review of campaigns found some more great examples. Even when handling basically the same content, there are plenty of different design approaches to take. You can choose to emphasize particular designs, to drive purchases directly from the email, or you can just push people to the website. Different goals will create different designs, from visual positioning to copywriting, length and frequency. One factor not focused on by any of these examples is the shirt construction – no mention of the shirt fabric or printing technology. No mention of environmental impact or location of manufacture. I’m sure there are more examples out there that cover these areas too. Where do you buy your t-shirts? Do you subscribe to these emails? Are you loyal to a store, or just focused on the shirt designs?

Blog Post

Watch Your Language!

That which we call a rose by any other name would smell as sweet At least so said Shakespeare in Romeo and Juliet. He may be right about the smell, but I think we can all agree that renaming a rose to stinkweed would not bode well for chances at Chelsea. Recently there’s been discussion of the affect names can have on the way readers understand and think about things. We covered it ourselves (see email as conversation, not invasion) and Aweber’s Justin Premick made the same point. As web designers it is easy to slip into jargon mode. A great percentage of the people we talk with, read from and are influenced by are basically insiders, immersed in the language of nerdery. AJAX, .Net, rendering engines, DOM scripting, XHTML, selectors….to outsiders it might as well be Klingon. When you are sending emails to ‘normal’ people though, it’s no good using insider jargon. It’s saves time for us when talking to each other, but for outsiders it is incomprehensible. Instead, we need to be careful not to assume too much background knowledge. When we talk to our web design clients, it might mean going right back to basics, and explaining terms the first time they are introduced. I’m sure most of us are pretty used to that by now. When using Campaign Monitor though, there is another factor to consider:Your client is an insider in her industry too. She knows a ton of jargon about event planning or car tyres or scuba diving. There is a big risk that your clients will forget that their readers don’t know all the jargon either. So when you are putting together emails for your clients, have a thorough read of the content they are sending. You are probably not an expert in their field, so you’ll be in a great position to point out confusing and unnecessary jargon. Your clients will be happy to hear the feedback from you, rather than have their subscribers end up confused or disinterested. Not to mention that if you can provide some content consulting as well as the technical services, you are worth paying more! If you’d like to learn other ways you can help your clients become smart email marketers, we highly recommend reading Mark Brownlow’s The new email marketing. It’s a continuing series of great posts that aims to “explore the tactics used by enlightened marketers to exploit email successfully, sustainably, ethically and efficiently”. How many of you offer more than ‘just’ design and technical work for your clients? How many would like to start?

Blog Post

Recent Changes to CAN-SPAM

If you are a US based sender of email, you’ll be aware of the CAN-SPAM Act which regulates commercial email sent from the US. Last month the US Federal Trade Commission announced some additions to the Act, and we wanted to bring them to your attention. Of course, Campaign Monitor’s anti-spam policies have always been stricter than required by law, but it is still important to understand your legal obligations. From the FTC press release, the four new provisions are: an e-mail recipient cannot be required to pay a fee, provide information other than his or her e-mail address and opt-out preferences, or take any steps other than sending a reply e-mail message or visiting a single Internet Web page to opt out of receiving future e-mail from a sender” You’re covered here by using the instant unsubscribe link through Campaign Monitor, which is required in every campaign. the definition of “sender” was modified to make it easier to determine which of multiple parties advertising in a single e-mail message is responsible for complying with the Act’s opt-out requirements; This one is a bit unclear, but unless you are sending a single campaign to multiple client lists (which we would not recommend) nothing changes. This is how a lawyer involved in the Act describes this change: This requirement is an effort to hold affiliate programs responsible for how their affiliates promote them. If the affiliate is honest about who they are, and their “From address”, and if they put something in the email about themselves, then the user will be able to unsubscribe from the affiliate’s list. But if the affiliate is dishonest, and hides their true identity, then the affiliate program for the product featured in the email (which will be the product being sold under the affiliate program) becomes responsible. (above was taken from a comment by Anne P. Mitchell on The Gripe Line). The next item is: a “sender” of commercial e-mail can include an accurately-registered post office box or private mailbox established under United States Postal Service regulations to satisfy the Act’s requirement that a commercial e-mail display a “valid physical postal address” We actually get that question occasionally: Is it OK to list a post office box and not a street address. Now it is clear that is acceptable. a definition of the term “person” was added to clarify that CAN-SPAM’s obligations are not limited to natural persons This seems to be about not allowing unsolicited email even when it is sent to a company or other entity, rather than a specific person. Again, not something allowed through Campaign Monitor in any case. So while these changes won’t impact on most Campaign Monitor customers at all, it’s always useful to know what the current landscape is, and to be able to speak to your clients about their obligations. If you are not in the US, make sure you check for similar requirements in your own country.

Blog Post

A Guide to CSS Support in Email: 2008 Edition

In the last year, we’ve seen some changes in the email client market. Webmail usage continues to grow significantly while new versions of popular desktop clients have been released. In an attempt to stimulate some improvement on the CSS front, we’ve helped launch the Email Standards Project. While we can hope for future improvements, it’s the present we need to design for. The time has arrived to again poke and prod the major email clients to determine just how much (or how little) support they provide for using CSS with HTML emails. Last year’s report focused on the unique challenges of Outlook 2007. In 2008, Outlook is still an issue, but there are encouraging signs in other areas. The release of Entourage 2008 (the Mac equivalent of Outlook) made great improvements with CSS support, bringing it on par with Apple Mail’s excellent rendering. Proof that perhaps Microsoft has been listening and we can only hope that the next version of Outlook will follow suit. Thunderbird 2 was released with plenty of new features, and continued it’s run of excellent CSS support. Gmail has probably been the most disappointing client of all. One of the advantages of web applications is not needing to wait for new versions to be rolled out. With just basic in the head CSS selector support Gmail would go from bad to good but we’re still waiting for that. Checkout the Email Standards Project post about some support inside Google though, and keep your fingers crossed. We did expand our testing this year — A combined total of 21 email/web clients making this the biggest test we’ve ever done, up from last years 13. The CSS support in email guide is permanently located at https://www.campaignmonitor.com/css/, and that’s the best page to bookmark to ensure you are always seeing the latest version. Read the full report at https://www.campaignmonitor.com/css/

Blog Post

CSS Support in mobile.me Email?

Although the majority of the Freshview team slept blissfully through the WWDC keynote, we were all interested to hear about Apple’s new Mobile Me service, which will replace .mac in July. Once Apple’s new web applications are up and running, we’ll be sure to thoroughly test the .me email client and see how well it supports CSS in HTML email. If you can’t wait for that, you can content yourself with an update to our CSS support chart which will be coming later this week. In thinking about the continuity of email from desktop to web to mobile, one question occurs: How would you change your email newsletters if you new your readers were mobile, not sitting at their desk? Would you make them shorter? Would you have different content? Less images? More links or less links? Your thoughts appreciated! Update: One thing we forgot to mention is that Cameron Moll’s excellent book on designing for mobile devices is on sale for $10 a pop! While not focusing on email design per se, it’s still a great primer for those considering how best to approach designing for mobile devices.

Straight to your inbox

Get the best email and digital marketing content delivered.

Join 250,000 in-the-know marketers and get the latest marketing tips, tactics, and news right in your inbox.

Subscribe

Get started with Campaign Monitor today.

With our powerful yet easy-to-use tools, it's never been easier to make an impact with email marketing.

Try it for free