Browse by...
Home Resources Blog

Blog Post

Less stalking, more talking

You’ve sent out that latest newsletter on behalf of your client, and excitedly they login, watching their pie chart change colours as people open the email. Everybody loves the reporting and statistics you can get from using Campaign Monitor, because it makes it so easy to see what is working, and what is not. In fact, it can become quite addictive! So it is easy to forget that your subscribers might not feel quite the same way about being tracked and recorded. While many people have some understanding about click tracking (and things like Outlook’s read receipts), they can be understandably uncomfortable with the idea of someone watching everything they do. Recently Neville Hobson wrote on his blog about an email he received from Dell Computers. The email was targetted at people who had not opened Dell’s previous campaigns. … I was taken aback when I read the text alongside the ‘Shock, horror!’ title: Can we take a minute of your time? It’s just that it seems you haven’t opened any of our recent emails. Wtf? I thought to myself. How does Dell know I haven’t opened an email? Leaving aside the fact that not all opens can be recorded, clearly Neville was surprised and shocked that the information was known about him. Neville later goes on to clarify the core of his feelings: Maybe it’s the approach in Dell’s email that offends me, the wording that in one way or another says “We’re watching you and what you do on your computer, and you won’t know about it – unless you don’t open our emails, and then we’re gonna jump on you.” It’s a timely reminder that privacy and the ownership of their own activity is very important to most people. Even though the open and click tracking is available, we should treat it very carefully. That means not being too aggressive in your phrasing, and not assuming that the small amount of information you have about someone’s activity means you understand what they want and need. Most of your subscribers won’t be upset if you use your reports to decide what content is not as interesting to them, and drop it from the emails they see. They would probably be happy to see the improvement! They don’t need to have shoved into their face how you worked that out though. You could end up like Bill Murray in Groundhog Day, gleaning more and more information each campaign until it gets you into big trouble. So tread carefully, be respectful of people’s inbox, their privacy and the complex balance between making an email useful, and abusing personal information. If you are dealing with particularly sensitive topics, like health, then you probably need to be even more cautious. How do you think your subscribers would feel if they understood exactly what was being recorded when they read your emails?

Blog Post

Web Directions South 2008

In just 3 weeks it will be time once again for the always excellent Web Directions conference in Sydney. Like last year, we’ll have a stand in the expo hall, where you can come up and lobby for your favourite feature request, ask questions or just say ‘hi’. If you are going to be there, then make sure you drop by, because we love to see people face to face. In 2007 we gave away an iMac — this year we also have a prize, to be revealed later. I can tell you right now that wearing a Campaign Monitor shirt will get you an extra entry into the competiton, so buy, borrow or steal one before you go! Speaking of shirts, the fun new Web Directions shirt is now available too, as is the artwork for remixing. Here’s a Campaign Monitor version: Don’t come to Web Directions just for the shirt, or just to see us! Come for the awesome (that was for you Dean;) line-up of speakers including Jeffrey Veen, Jina Bolton and Mark Pesce. See you there!

Blog Post

Subscribe your Shopify purchasers to your Campaign Monitor list

If you’ve checked out our Campaign Monitor shirts then you’ve experienced Shopify, a slick hosted ecommerce product. It’s super fast to setup and a great choice for selling anything from t-shirts to toasters online. This morning on the Campaign Monitor forums, Alex Dunae has just announced his Campaign Monitor “Subscribe” Web Hook for Shopify You may remember Alex from such hits as Premailer and Gladys the Groovy Mule. Alex’s code allows you to easily process a Web Hook from Shopify and subscribe the purchaser to a specific Campaign Monitor list via the API. Read more and download the code to get started. Another great job Alex! Finally, speaking of our shirts, if you’ve got one, and you are coming to Web Directions in Sydney, make sure to wear it. You’ll an extra entry in our competition…more on that later.

Blog Post

Embedding Images Revisited

We have updated results for embedded image/data URI support in email – view our latest post. In a recent post we discussed our (poor) results from testing embedded images in email. A couple of people pointed out a different method we could use that may produce better results. So we’ve run through our tests again, this time with the image as a Base64 encoded attachment to the message. Here’s how it went. Embedding as an attachment Rather than having the image src be the encoded data, this time we define the email as a multipart/related file, and place the encoded image in a separate section of the email. Then in the body of the message, we refer to the image via its identifier which is specified for each attachment. Results for embedded attachment cid method This time around, we did see some better results. The image was rendered by default in the desktop clients at least, but still not in webmail clients. Apple Mail Yes-Image displays inline and as attachment Entourage 2008 Yes-Image displays inline and as attachment Gmail No-Image will not display Windows Live Hotmail No-Image will not display Outlook 2003 Yes-Image displays inline and as attachment Outlook 2007 Yes-Image displays inline and as attachment Thunderbird 2 Yes-Image displays inline and as attachment Yahoo! Mail No-Image will not display Although the images did show up ok in desktop clients, in webmail clients they did not at all, even after clicking ‘display images’ or equivalent. Additionally, in the desktop clients the images are shown inline, but also as attachments on the bottom of the email. If you have just one image, it might be ok, but with most newsletters you will have an email that ends with a messy jumble of individual image attachments. Imagine the Threadless newsletter for example. The increased initial download size, and hence slower speed, the failure to show for increasingly popular webmail clients and the hassle of attachments still seem to indicate that embedded images are not the way to go in most cases. Our recommendation is still to have the understanding that your images may not display, and design your emails accordingly. Please note that Campaign Monitor itself does not support embedding images in this way at all, we tested outside of our application. Thanks to everyone who commented and suggested this additional test, we appreciate the feedback.

Blog Post

CSS Support for MobileMe

Last month Apple replaced .Mac with a new service called MobileMe and while it is certainly slicker visually and nicer to use, in terms of CSS support the results were mixed. We ran MobileMe through our baseline CSS test, and found that there were improvements in some areas (see our Email Standards Project test result) but in other places some CSS support was actually degraded compared to .Mac rendering. It is still a very solid client, but of course it is never nice to see the level of support going in reverse. MobileMe lost point in CSS selectors, and we saw odd results with link colours and heading styles. CSS defined in the head is partially ignored (for example in lower level headings) but if you drop the styles inline, everything seems to render much more reliably, much like Gmail. Nonetheless, MobileMe dropped a few points in our test. We’re already planning the next version of the CSS test, which will broaden its scope to better cover both inline styles and styles in the head, giving you as much information as possible to build emails which will render more consistently. If you haven’t already checked them out, take a look at our free email templates which are built using all the information gathered during the CSS test.

Blog Post

Embedding Images in Email

We have updated results for embedded image/data URI support in email – view our latest post. With the well known growth in image blocking by email clients, some customers have been looking for alternatives to linking web based images into HTML emails. Some years ago, image embedding used to the standard way images were included in emails. It differs from linked images in that the image itself is actually encoded, and included inside the message. So once you have downloaded the email, you are not reliant on a web connection to view the images, because you have it all locally. It sounds perfect, except for a big increase in email size vs downloading just the HTML and then the images afterwards. We get asked fairly often why we don’t allow image embedding to work around image blocking. Our position (‘It is not worth it for the cost in filesize) has been based on testing done some years ago, before image blocking was so common. So we though it was time to update our test results. Testing embedded images in email Here’s the recipe for creating HTML emails with embedded images: Take one HTML page, with your text content and CSS Grab an image you want to send embedded in your email Use a Base64 encoder to turn your binary photo into a huge text string Replace your normal image source with that string Save your file and send as normal When you have added your encoded image, you end up with an HTML document which looks something like this: You will notice you have an enormous text file if you are encoding any kind of photograph. I took this file, and sent it out to a bunch of the major email clients, to see if they would render it. Embedded images test results The results were almost uniformly bad. Of all the email clients we tested, only Apple Mail showed the photo at all (and it shows linked images by default anyway). Email Client Result Notes Apple Mail Yes Showed perfectly Entourage 2008 No Alt attribute and image outline only Gmail No Alt attribute and missing-image outline only Windows Live Hotmail No A grey block with no alt attribute Outlook 2003 No Alt attribute and missing-image outline only Entourage 2007 No Alt attribute and missing-image outline only Thunderbird 2 No Alt attribute, no missing image outline Yahoo! Mail No Alt attribute and missing-image outline (Classic & New) So based on our results, it is clearly not worth using embedded images in your emails. All you will be doing is forcing people to download encoded images that they will not be able to view. Instead, the best course is to follow our normal design guidelines and design your emails knowing that some people will not see your images. That means making sure your copy stands alone, and that it is visible high enough for people to see if images are blocked. Don’t forget to link prominently to a web version too, especially if your images are particularly important. Update See our follow up post in which we tested with a different method of embedding, with somewhat better results.

Blog Post

Speed up Template Development with TextMate

Part of creating the 33 new HTML templates for Campaign Monitor and MailBuild was to also come up with an easy way to test these designs without having to leave the comfort of my development environment. Since most email clients render HTML email better with inline CSS, maintaining an organized yet easy to update template becomes next to impossible (especially when building 33 of them). It just so happens that TextMate has an incredibly useful plugin architecture called “bundles” that could deal with this problem rather easily. Here’s a quick demo with the details below. So what we did was create a bundle that does exactly that. Create your email like you would any other webpage with a linked stylesheet or inline style. Run one of the bundle commands and it automatically runs through adding all of the CSS styles inline keeping it easy for you to update. Even better, you can email an HTML multipart email directly from within TextMate! Testing has never been this easy. If all of this sounds too good to be true, hop on over to our TextMate bundle resource page. Be warned in advance though, this is definitely one of the most developer targeted resources we’ve ever thrown up. And of course, if you haven’t got access to lots of different email clients, our design and spam test tool can run it through more than 20 of the most popular clients with a single click.

Blog Post

Teaser Signup Pages with Campaign Monitor

What is a ‘web 2.0’ type experience? Nobody seems to know for sure, but there is a few common ideas. There’s the gradients and corners, the community-social-linking-sharing love in and the catastrophic shortage of vowels. While there is debate about whether or not CampaignMonitr itself qualifies (surely email is pretty much web 0.5!), we do see Campaign Monitor used a lot for one more web 2.0 ingredient, the teaser signup page. You know the ones, with the enormous text field for adding your address, the big logo and the promise of an impending launch for a new web application. Ideally the page should give almost nothing away about what the application actually does. We love a good teaser page, and Campaign Monitor is a great tool to use when setting one up. You can create your account, setup a list, and collect names and email addresses as long as you like for absolutely no cost, you only pay when you send (which gives you time to secure that second round of funding!). Super designer Shaun Inman, creator of the excellent Mint which we use ourselves, has written up how he built his teaser page for the upcoming Fever. My sign-up pages usually have three states: The sign-up form The status message for subscribers The unsubscribe message for the dearly departed All three states are served from the same page. Which state is displayed depends on an optional query string and the presence of a cookie. Shaun goes on to provide his actual PHP code to make it all work, which you can use for your own pages. The technique uses Campaign Monitor’s ability to have custom unsubscribe and subscribe redirect page URLs for each list. Jump over to the Fever site and add yourself to see it in action. Thanks to Shaun for sharing his code, and for his kind words about Campaign Monitor! p.s Please consider this your invitation to post a link to your own teaser page, we’d love to see them!

Blog Post

Designers Are Everywhere!

A little while back I posted a poll that asked ‘Who do you design for?‘. The idea was to find out whether you were mostly freelancers, design company owners or employees, inhouse designers or something else. We’ve had over 300 responses covering all areas of design, and we wanted to let you know how the votes have played out. Who do you design for? Votes % Run my own design company 81 25% Freelancer designer 49 15% Inhouse designer for a web/software company 45 14% Inhouse designer for a non-web company 42 13% Designer for a marketing agency 34 10% Designer on the side, not my main job 32 10% Work for a pure design agency 16 5% Other 14 4% Designer for an educational institution 12 4% Designer for a government body 4 1%   Clearly the dominant group is designers running their own companies. 25% of you are in that position, which is fantastic. One interesting piece of information is that the responses were heavily skewed towards owners and freelancers when the poll first went live. However, after we mentioned the poll in our newsletter, we had a big jump in the number of inhouse designers. Perhaps inhouse designers are less likely to spend time on the blog? Inhouse designers (at web and non-web companies combined) make up slightly more than a quarter of respondents. Designers in marketing agencies, and ‘on-the-side’ designers make up the other big groups. So what can we learn from this? For one thing, clearly design is being integrated into all forms of business, so the opportunities for designers to work in a variety of areas are huge. On the other side, Campaign Monitor customers seem highly likely to be business owners as well as designers, which is a whole other area of expertise. So we’d love your feedback on this: Should the Campaign Monitor blog stick to the technical side of HTML emails? Should we include more content of general interest to web designers? Don’t worry, Campaign Monitor will always be the place for in depth research and guidance, but our ultimate aim is to help designers build their businesses. If we can do that in other ways, let us know! Don’t forget that we also blog (sporadically!) over at Freshview about the company, and we could perhaps talk more about business on that blog. Thanks to everyone who took the poll, we appreciate your time, and please do leave us a comment!

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

Making Certain Fields Required in Your Signup Forms

New! We have a simpler method for adding validation to forms – view it here. One of the more common questions we get asked is if you can make certain fields be required when people sign up to your list through a Campaign Monitor form. We don’t have this functionality built in, mostly because you can create a much better experience for your visitors by taking care of that right there on your form page, rather than sending them off to a generic Campaign Monitor error page. Most of you Campaign Monitor customers are smart cookies who have your own approach to error messages and server side scripting, and are happy to cook something up yourselves. However, sometimes it is just easier if you have something to start you off. So here’s a basic javascript form validation script, which you can examine, copy, tweak or take as you like. It’s based on code from the excellent DOM Scripting book by Jeremy Keith, and should give you enough of an idea to work with. Adding validation to your form The first step is to take your subscribe form, and add a CSS class to define which fields will be required. You could make as many as you like required, but remember that the less work people have to do, the more likely they are to sign up. <form action="http://abcwidgets.cmail1.com/s/133578/" method="post" onsubmit="return validateForm(this);" class="list-form"> <ul><li> <label for="name">Name:</label> <input type="text" name="name" id="name" class="required" /></li> <li><label for="l133578-133578">Email:</label> <input type="text" name="cm-133578-133578" id="email" class="email required" /></li> <li><label for="cm-f-184432">Nickname:</label> <input type="text" name="cm-f-184432" id="Nickname" /></li> <li class="sub-button"><input type="submit" value="Subscribe" /></li> </ul> </form> You can see I’ve added class=”required” to the text fields I want to make compulsory, and class=”email required”> in the case of the email address. I’ve also added an onsubmit parameter to the form tag, which will run our validation function when the submit button is clicked. Now we need to add some javascript into the head of the page with our form on it. Remember, you cannot change the form element names, because that will prevent the form working. You can change the ID of the elements though, if you need to refer to specific fields in your script. <script type="text/javascript"> function validateForm(theform) { for (var i=0; i<theform.elements.length; i++) { var element = theform.elements[i]; if (element.className.indexOf("required") !=-1) { element.className = "required"; if (!isFilled(element)) { alert("Please enter your " +element.id); element.className += " error"; element.focus(); return false; } } if (element.className.indexOf("email") !=-1) { element.className = "required"; if (!isEmail(element)) { alert("Please check you have entered a valid email address"); element.className += " error"; element.focus(); return false; } } } return true; } function isFilled(field) { if (field.value.length < 1) { return false; } else { return true; } } function isEmail(field) { if (field.value.indexOf("@") == -1 || field.value.indexOf(".") == -1) { return false; } else { return true; } } </script> Without getting too far into details about exactly how the script works, here’s the outline: The function validateForm runs when the submit button is pressed We loop through all the elements, looking for the ones with a class of ‘required’ or ’email’ When we find a required field, we check to see if it is empty, and if so, trigger an error and addan ‘error’ class to the field If the field is an email field, we also run a simple check to see if it looks like a valid email We return ‘true’, if all is well, and the form is sent, or ‘false’ if not, and the submit is cancelled Note: I’ve only used alert messages here (and some CSS styling), which is not the ideal way to notify. You will probably want to write out an error message next to the problem field. I’m also just notifying about one error at a time, which is fine for very small forms, but annoying for anything longer. If you have bigger forms, you’d want to create an array of the errors, and write them all out at once instead. A final note is that the script only deals with text fields – if you have dropdowns for example you need to modify your testing slightly. That’s it! A very simple version of form validation to make sure people can’t leave key fields empty when signing up. Take it, and amend it to work for you or your clients.

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