<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
    xmlns:admin="http://webns.net/mvcb/"
    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
    xmlns:content="http://purl.org/rss/1.0/modules/content/">

    <channel>
    
    <title>Campaign Monitor Blog</title>
    <link>http://www.campaignmonitor.com</link>
    <description></description>
    <dc:language>en</dc:language>
    <dc:creator>Freshview</dc:creator>
    <dc:rights>Copyright 2012</dc:rights>
    <dc:date>2012-05-15T04:55:30+00:00</dc:date>
    <admin:generatorAgent rdf:resource="http://expressionengine.com/" />
    

    <item>
      <title>Why hold email to a higher standard?</title>
      <link>/blog/post/3730/why-hold-email-to-a-higher-standard/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3730/why-hold-email-to-a-higher-standard/</guid>
      <description><![CDATA[
			
							<p>The other day, Laura at <a href="http://blog.wordtothewise.com/">Word to the Wise</a> got me thinking with her post, '<a href="http://blog.wordtothewise.com/2012/05/email-is-different/">Email is different</a>'. To loosely recap, the post answered a question which likely echoed the sentiments of many towards issues like anti-spam legislation and permission, being:</p>

<p><blockquote>'Why do so many feel that email should be somehow held to a higher standard than other direct marketing channels?'</blockquote></p>

<p>In comparing TV and radio segments to email, Laura made some clear distinctions - the former two have been marketing channels from the beginning. They're broadcast mediums. They've been created by marketers, are wholly paid for by owned by marketers and therefore marketers are entitled to pester each and all who choose to tune in with marketing messages.</p>

<p>Email is different because it's not solely a marketing channel. The cost of spam isn't borne simply by the sender, but by hosts, ISPs, recipients and everyone in-between.</p>

<p>Nonetheless, it must seem strange to those with limited email experience that it's <strong>not okay</strong> to purchase an email list, while the practice of buying and selling personal information remains widespread amongst telemarketers and direct mailers. Why should email be put on a pedestal? After all, consumers don't pay phone line rental in order to receive unsolicited calls at dinnertime... But they still happen, without consequence to the call center, or their clients.</p>

<p>I'm sure a lot of designers, perhaps you included, have had conversations along these lines. Personally, I think senders of unsolicited email should be held accountable because they cost ISPs and ESPs a supreme amount of development time - all those super-intelligent engineers working on spam detection and filtering tools could really be off making the world a better place in other ways. Senders can create worldwide, widespread inconvenience, with very little time and effort. They should also be held accountable because it's technically possible to do so.</p>

<p>However, this is a can of worms I wanted to share with you. <strong>When your clients ask why they can't purchase lists and send unsolicited email, what do you say?</strong> We're looking forward to your opinions in the comments below.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-05-15T04:55:30+00:00</dc:date>
    </item>

    <item>
      <title>Mobile set to surpass desktop and webmail email client usage by July</title>
      <link>/blog/post/3726/mobile-email-set-to-surpass-desktop-and-webmail-client-usage-by-july/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3726/mobile-email-set-to-surpass-desktop-and-webmail-client-usage-by-july/</guid>
      <description><![CDATA[
			
							<p>Use of mobile email clients is set to <a href="http://www.returnpath.net/blog/intheknow/2012/05/email-in-motion-how-mobile-is-leading-the-email-revolution/">surpass desktop and webmail client usage by July</a>, according to the results of a recent study by our friends at <a href="http://www.returnpath.net/">Return Path</a>. After examining data from over 90 email clients, amounting for more than 130 million data points over a 6 month period, Return Path found that while webmail clients overall are on a slow decline, <a href="http://returnpath.net/landing/mobilestudyQ212/">mobile views increased by 82.4%</a> over the same period (March '11 &#8211; March '12). Mobile devices currently claim 16% of overall email client market share, with 85% of mobile email opens occurring on an Apple iOS device. This is <a href="http://www.campaignmonitor.com/stats/email-clients/">comparable to our earlier findings</a>.</p>

<p>Return Path also found that there is an uptick in mobile email readership during the weekend, which can be attributed to email recipients switching from the desktop to a smartphone outside of office hours. Conversely, it's at its lowest on a Wednesday, when presumably folks are at their most busy tackling their Outlook, or OSX Mail inboxes.</p>

<p>The implications for email senders like you and I are fairly clear. As Tom at Return Path states <a href="http://www.returnpath.net/blog/intheknow/2012/05/email-in-motion-how-mobile-is-leading-the-email-revolution/">in his summary</a>:</p>

<p><blockquote>"... those that aren&#8217;t tracking which device their subscribers are reading their emails on, or optimizing their emails or websites for mobile devices stand to lose out. &#160;A poor user experience could mean no response, no action, or plainly put, no ROI."</blockquote></p>

<p>If you aren't already optimizing your emails for mobile, now is the time. To set you on the right path, we've got a <a href="http://www.campaignmonitor.com/blog/post/3442/mobile-email-design-in-practice/">practical primer on email design</a>, not to mention a <a href="http://help.campaignmonitor.com/topic.aspx?t=210">neat template builder</a> which can whip together mobile-ready campaigns in a matter of minutes.</p>

<p><strong>Out of curiosity, will Return Path's findings change the way you send campaigns?</strong> Let us know in the comments below.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-05-08T00:14:09+00:00</dc:date>
    </item>

    <item>
      <title>How can we improve? Let us know and score a t&#45;shirt!</title>
      <link>/blog/post/3725/how-can-we-improve-let-us-know-and-score-a-t-shirt/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3725/how-can-we-improve-let-us-know-and-score-a-t-shirt/</guid>
      <description><![CDATA[
			
							<p>Customer feedback shapes much of what Campaign Monitor is today, not to mention what it will become in the future. So we thought we'd reach out and see what one thing Campaign Monitor customers like you would like to see improved about our service.</p>

<p>In return, we've got a modest mountain of <a href="http://www.campaignmonitor.com/blog/post/2890/campaign-monitor-tees/">ultra-exclusive Campaign Monitor t-shirts</a> to give away, one per customer. Apologies in advance if we run out of your size - you'll see what's available after submitting your feedback. If we've run out of shirts and closed the giveaway, don't worry - we'll have new swag and more giveaways in the coming months, so watch this space.</p>

<div id="wufoo-m7x2x3">
Fill out my <a href="http://campaignmonitor.wufoo.com/forms/m7x2x3">online form</a>.
</div>

<script type="text/javascript">var m7x2x3;(function(d, t) {
var s = d.createElement(t), options = {
'userName':'campaignmonitor', 
'formHash':'m7x2x3', 
'autoResize':true,
'height':'378',
'async':true,
'header':'show', 
'ssl':true};
s.src = ('https:' == d.location.protocol ? 'https://' : 'http://') + 'wufoo.com/scripts/embed/form.js';
s.onload = s.onreadystatechange = function() {
var rs = this.readyState; if (rs) if (rs != 'complete') if (rs != 'loaded') return;
try { m7x2x3 = new WufooForm();m7x2x3.initialize(options);m7x2x3.display(); } catch (e) {}};
var scr = d.getElementsByTagName(t)[0], par = scr.parentNode; par.insertBefore(s, scr);
})(document, 'script');</script>

<p>Thank you so much for helping us improve - we'll be in touch if we make good on your suggestion. Now get some of that t-shirt action!</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-05-03T06:55:30+00:00</dc:date>
    </item>

    <item>
      <title>Email results in more shares, conversions&#8230; And is still good value</title>
      <link>/blog/post/3688/email-results-in-more-shares-conversions-and-is-still-good-value/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3688/email-results-in-more-shares-conversions-and-is-still-good-value/</guid>
      <description><![CDATA[
			
							<p>When justifying the time and effort that goes into email marketing, it's always good to have a few stats on your side. It's likely you've heard some of the <a href="http://www.email-marketing-reports.com/basics/why.htm">big reasons</a> (like its <a ref="http://www.magillreport.com/Email-Remains-ROI-King-Net-Marketing-Set-to-Overtake-DM/">return of $40.56 for every $1 invested in 2011</a>), however in a world that's still social media mad, there's two stats that show that email is still on top, being sharing and conversion rates.</p>

<h3>'Forward to a friend' the most common share method</h3>

<blockquote class="pull"><p>"A food delivery service gets 70% of its shares through email and another 15% via Facebook."<br /><small>- <a href="http://sherpablog.marketingsherpa.com/social-networking-evangelism-community/social-sharing/">Social Sharing: Twitter has highest amplification rate, email has highest conversion rate</a></small></p></blockquote>

<p>While Twitter and Facebook may be where many consider social sharing to be at, email dominates social referrals.</p>

<p><a href="http://sherpablog.marketingsherpa.com/">MarketingSherpa's blog</a> reported on this in, '<a href="http://sherpablog.marketingsherpa.com/social-networking-evangelism-community/social-sharing/">Social Sharing: Twitter has highest amplification rate, email has highest conversion rate</a>', which reflected on the experiences of a recent referral program by <a href="http://extole.com/">Extole</a>, a consumer-to-consumer social marketing company. The study found that Extole customers who participated in the referral program shared with almost three and a half friends on average, with most of those shares occurring via email.</p>

<p>For us, this isn't unusual behavior. For example, here's a snippet from the social sharing reports following <a href="http://createsend.com/t/y-5B4E5413DAE0B54E">our most recent monthly newsletter</a>, sent to over 130,000 subscribers:</p>

<p><img src="http://i3.campaignmonitor.com/uploads/images/social-sharing-520.jpg" alt="Social sharing report" width="520" height="176" style="border: 1px solid #ccc; padding: 5px;" /></p>

<p>Despite featuring equally prominent Twitter and Facebook share links, 83% of shares were via the 'Forward to a friend' link in the campaign. This means that subscribers were over six times more likely to share the campaign via email, versus Twitter and Facebook combined!</p>

<h3>Email results in more conversions</h3>

<p>What's important to many business owners is not so much how many clicks an email or tweet generates, but how many of these result in actual conversions, let they be a sale, an opt-in or a coupon redemption. Again, email rules. Based on the same Extole study, email shares resulted in a <i>"21% open rate, 80% clickthrough and 17% conversion (the highest conversion rate of any channel), which breaks down to .17 clicks per share."</i> This is impressive, considering that Facebook had a conversion rate of only 1.21% and the overall average clickthrough rate for social referral programs using Twitter, Facebook, personal URL and email combined was 42%. Or as Angela from Extole noted, <i>"We&#8217;ve always known that word-of-mouth marketing was very powerful, and converted at an estimated three to five times higher rates than other channels"</i>.</p>

<p>&#8232;The great news is that it's easy to add social sharing to your email campaigns, let it be a 'Forward to a friend' link, or Like / Tweet button for Facebook and Twitter respectively. <a href="http://help.campaignmonitor.com/topic.aspx?t=180">Here's our walkthrough</a> on adding sharing to campaigns... Or you can add your own links on the fly to templates via the email editor.</p>

<p>Many thanks to MarketingSherpa for <a href="http://sherpablog.marketingsherpa.com/social-networking-evangelism-community/social-sharing/">sharing their study with us</a>. <strong>What have your experiences been with social sharing? Why do you think email trumps Facebook and Twitter?</strong> Let us know in the comments below.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-04-25T23:13:07+00:00</dc:date>
    </item>

    <item>
      <title>Hats off to Hotmail, for replacing symbols with oversized emoji</title>
      <link>/blog/post/3716/hats-off-to-hotmail-for-replacing-symbols-with-oversized-emoji/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3716/hats-off-to-hotmail-for-replacing-symbols-with-oversized-emoji/</guid>
      <description><![CDATA[
			
							<p class="alert-1">This issue has been resolved by Hotmail - many thanks to everyone who contacted them with their emoji-related grievances!</p>

<p>This week, a rather obvious Hotmail quirk cropped up. By obvious, I mean that a garden-variety set of symbols like &copy; &reg; and &trade; are being replaced by <img src="http://gfx2.hotmail.com/mail/w4/pr04/ltr/emoji/emoji_000A9.gif" /> <img src="http://gfx2.hotmail.com/mail/w4/pr04/ltr/emoji/emoji_000AE.gif" /> <img src="http://gfx2.hotmail.com/mail/w4/pr04/ltr/emoji/emoji_02122.gif" />, or 19px x 19px 'emoji' GIF images. Apparently Hotmail thought this would be a fun way to spice up HTML email newsletters, when in fact, it's an annoyance to designers, who don't want to have tiny footer text broken up by a &copy; character that's the size of a fist.</p>

<p>Yes, the images are here to stay - there's a new bit of JavaScript code in Hotmail which ensures that no symbol goes by unmolested.</p>

<p><img src="http://i3.campaignmonitor.com/uploads/images/hotmail-emoji-270.jpg" alt="Emoji in email" width="270" height="180" align="right" style="border: 1px solid #ccc; padding: 5px; margin: 0 0 0 15px;" /></p>

<p>To make matters worse, if you have <code>img { display: block; }</code> in your email design's CSS code to <a href="http://www.campaignmonitor.com/blog/post/3132/how-to-stop-gmail-from-adding-a-margin-to-your-images/">prevent gaps in Gmail</a>, each emoji will be followed by a line break (pictured).</p>

<h3>Bringing emoji down to size</h3>

<p>Thankfully, there's a fix - resizing the images so they're more in line with the surrounding text. After viewing a couple of the solutions being spun around, we took a crack at our own and found that adding the following CSS code to your stylesheet works a charm:</p>

<p><style type="text/css">
.codeblock {
width:92%;
display:block;
padding:20px;
overflow:none;
word-wrap:break-word;
margin-top:20px;
margin-bottom:20px;
background: #ededed;
font-size: 0.8em;
}
</style></p>

<div class="codeblock"><code><span style="color: #000000">
<span style="color: #007700">.</span><span style="color: #0000BB">ExternalClass&nbsp;img&#91;class</span><span style="color: #007700">^=</span><span style="color: #0000BB">Emoji&#93;&nbsp;&#123;&nbsp;width</span><span style="color: #007700">:&nbsp;</span><span style="color: #0000BB">10px&nbsp;</span><span style="color: #007700">!</span><span style="color: #0000BB">important</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">height</span><span style="color: #007700">:&nbsp;</span><span style="color: #0000BB">10px&nbsp;</span><span style="color: #007700">!</span><span style="color: #0000BB">important</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">display</span><span style="color: #007700">:&nbsp;</span><span style="color: #0000BB">inline&nbsp;</span><span style="color: #007700">!</span><span style="color: #0000BB">important</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">&#125;&nbsp;</span>
</span>
</code></div>

<p>In the above fix, we're using an <a href="http://www.w3.org/TR/CSS2/selector.html">attribute selector</a> to say, <i>'if an image is assigned a class that starts with 'Emoji', make it 10px x 10px'</i>. You can change the size to whatever suits the surrounding text. The <code>display: inline !important;</code> has been added to prevent the Gmail gap fix from forcing line breaks. Also, the addition of <code>.ExternalClass</code> prevents Hotmail from renaming the <code>img[ ... ]</code>, <a href="http://www.emailonacid.com/forum/viewthread/43/#72">as it does to 'unique' classes</a>.</p>

<p>Alternately, if you were meaning to superscript symbols like &trade;, you can try:</p>

<div class="codeblock"><code><span style="color: #000000">
<span style="color: #007700">.</span><span style="color: #0000BB">ExternalClass&nbsp;img&#91;class</span><span style="color: #007700">^=</span><span style="color: #0000BB">Emoji&#93;&nbsp;&#123;&nbsp;width</span><span style="color: #007700">:&nbsp;</span><span style="color: #0000BB">8px&nbsp;</span><span style="color: #007700">!</span><span style="color: #0000BB">important</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">height</span><span style="color: #007700">:&nbsp;</span><span style="color: #0000BB">8px&nbsp;</span><span style="color: #007700">!</span><span style="color: #0000BB">important</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">vertical</span><span style="color: #007700">-</span><span style="color: #0000BB">align</span><span style="color: #007700">:&nbsp;</span><span style="color: #0000BB">super</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">display</span><span style="color: #007700">:&nbsp;</span><span style="color: #0000BB">inline&nbsp;</span><span style="color: #007700">!</span><span style="color: #0000BB">important</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">&#125;&nbsp;</span>
</span>
</code></div>

<h3>While we're talking Hotmail quirks...</h3>

<p><a href="http://www.campaignmonitor.com/meet-the-team/#stephen-jesson">Stephen</a> here recently brought to our attention that <code>mailto:</code> links have been disabled in Hotmail. As we've mentioned here before, <a href="http://www.campaignmonitor.com/blog/post/3323/should-i-use-a-mailto-or-link-to-a-contact-form/">using a contact form is preferable to using a <code>mailto:</code></a> when collecting responses - now Hotmail has made this more so.</p>

<p>Many thanks to <a href="http://www.emaildesignreview.com/html-email-coding/code-fixes/email-issue-copyright-symbol-breaking-in-hotmail-1382/">Email Design Review</a> for diligently reporting the issue and inspiring the above fix. There's a <a href="http://www.campaignmonitor.com/forums/viewtopic.php?pid=24548#p24548">great discussion on Hotmail's emoji in our forums</a>, so if you're more than welcome to join in and hang out with some of the smartest folk in email design.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-04-19T23:25:51+00:00</dc:date>
    </item>

    <item>
      <title>Time Out, on sending successful newsletters in 4 minutes or less</title>
      <link>/blog/post/3714/time-out-case-study/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3714/time-out-case-study/</guid>
      <description><![CDATA[
			
							<p><img src="http://i3.campaignmonitor.com/uploads/images/time-out-cover-520-1.jpg" alt="Time Out cover" width="520" height="697" style="border: 1px solid #ccc; padding: 5px;" /></p>

<p>Long before food bloggers and review sites came into being, there was <a href="http://www.au.timeout.com">Time Out</a>, a publishing company that's spent the last 40 years guiding us on what to do and where to go in the world's most exciting cities. Given the long-lasting success of their monthly magazines and websites, it wasn't really a surprise to see their email campaigns kicking some serious goals, too. In our <a href="http://www.campaignmonitor.com/casestudies/timeout/">most recent case study</a>, we got together with the <a href="http://au.timeout.com/sydney">Time Out Sydney</a> and <a href="http://au.timeout.com/melbourne">Time Out Melbourne</a> teams to find out how email fits into their fast-paced publishing schedule and get a few tips on how to send compelling email newsletters.</p>

<blockquote class="pull"><p>"...we can design an email, send a test and schedule it within 4 minutes - no joke!"</p></blockquote>

<p>If you've only dreamed of getting your newsletters out the door in minutes, as well as consistent click rates of 45-50%, then there's practical advice in here for you. Of course, it always helps to have a team of talented writers and photographers like Time Out does, but even those on a smaller budget than this content powerhouse will find a takeaway or two.</p>

<p>It also goes to show that 'old' and 'new' media are in no way incompatible. The idea that websites and email are somehow corroding the relevancy of print is at odds with the Time Out approach, which uses email to offer timely updates and bolster the brand in between their monthly magazine editions.</p>

<p>Read the full <a href="http://www.campaignmonitor.com/casestudies/timeout/">Time Out interview</a>, or browse through our other <a href="http://www.campaignmonitor.com/casestudies/">case studies</a>, including Q&amp;A's with 37signals, Xero and more.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-04-19T04:01:16+00:00</dc:date>
    </item>

    <item>
      <title>Deliver the goods with Goodsie&#8217;s online storefronts and email editor</title>
      <link>/blog/post/3710/goodsie-online-store-builder/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3710/goodsie-online-store-builder/</guid>
      <description><![CDATA[
			
							<p>Selling something? For a refreshing store-building experience, check out <a href="http://goodsie.com/">Goodsie</a> by <a href="http://hiidef.com">HiiDef</a>, popularly known as the makers of <a href="http://flavors.me">Flavors.me</a>. Goodsie is quite simply, a stripped-down, yet full-flavored online retail service for creating branded storefronts, sans code. You can either create a stand-alone store with a custom domain, or embed your products into an existing site, like a Tumblr or WordPress blog. Of course, the 'must-haves' are all there, like payment gateway support, coupon management and detailed sales stats.</p>

<p>To add the icing on the cake, Goodsie now <a href="http://blog.goodsie.com/post/20408333691/new-on-goodsie-email-marketing-sales-analytics ">sends email campaigns and manages mailing lists</a> using Campaign Monitor. Oh, did we mention that you can build really sexy storefronts? Check it out:</p>

<iframe src="http://player.vimeo.com/video/22572544?byline=0&amp;portrait=0&amp;color=00c4ff" width="530" height="298" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen style="margin-bottom: 20px;"></iframe>

<h3>Email marketing in the express lane</h3>

<p>As a fan of Flavors.me, I was excited to fire up a Goodsie Premium account and try building a store for myself. As it turns out, they've gone the whole hog with their email marketing service, which features a drag-and-drop email builder that automatically passes the completed HTML email to Campaign Monitor for delivery. You don't need to start a Campaign Monitor account, fiddle with API keys or pay additional fees to send as a Premium user - Goodsie handles all this for you behind-the-scenes. After sending, it also provides sales analytics so you can measure the impact of your email campaigns against your bottom line.</p>

<p><img src="http://i3.campaignmonitor.com/uploads/images/goodsie-create.jpg" alt="Create a campaign in Goodsie" width="520" height="494" style="border: 1px solid #ccc; padding: 5px;" /></p>

<p><img src="http://i3.campaignmonitor.com/uploads/images/goodsie-drag-drop.jpg" alt="Drag and drop builder" width="460" height="750" style="border: 1px solid #ccc; padding: 5px;" /></p>

<p>Another nicety is that mailing lists are handled for you in your Goodsie account - simply create a list and let the app's shopping cart and order database integration populate it with subscribers. Targeted email campaigns can be sent, based on customers' order history, purchase amount and geography.</p>

<p>Email marketing support is only available in Premium accounts, which are a flat $40/month. Considering that this includes email delivery and list management (alongside a growing list of extra features), Premium accounts make for bloody-good value.</p>

<h3>The best of both apps</h3>

<p>What I really like about the Goodsie / Campaign Monitor matching is how it cleverly draws the strengths of both services. Goodsie offers a stylish, streamlined, code-free store experience - building and managing a store feels effortless. We've worked towards offering a professional, white-label service to designers, backed up by robust infrastructure. Silently linking the two services via <a href="http://www.campaignmonitor.com/api">our API</a> makes things almost <i>too</i> simple. When sending campaigns from within the app, I couldn't but help feel that I was missing a step or two - wasn't Goodsie going to prompt me to enter my details? Hold on, my newsletter is sending... Wow.</p>

<p>Overall, Goodsie gives us the good vibrations. You can trial a Premium account for free for 30 days, then continue for $40 a month, or step down to a Standard account for $15 USD a month. <a href="http://goodsie.com/">Find out more at their site</a>.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-04-17T01:30:34+00:00</dc:date>
    </item>

    <item>
      <title>Animated GIFs in email: A new approach to an old format</title>
      <link>/blog/post/3682/animated-gif-support-in-email/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3682/animated-gif-support-in-email/</guid>
      <description><![CDATA[
			
							<p>Animated GIFs are going through a renaissance. In the last few months, we've seen them resurrected from the cringe-worthy virtual graveyard of 'Under Construction' banners and funny profile pics, to be <a href="http://fromme-toyou.tumblr.com/tagged/cinemagraph">redefined as fine art</a>. This trend is particularly relevant to email design, where GIFs and CSS animations are the only way to add moving images, given the <a href="http://www.campaignmonitor.com/blog/post/3529/html5-video-in-email-an-updated-guide-for-2011/">poor video support across the most popular email clients</a>.</p>

<p>But why use them? As Paul Boag quotes in '<a href="http://boagworld.com/design/its-time-to-look-at-animated-gifs-again/">It&#8217;s time to look at animated gifs again</a>':</p>

<blockquote><p>&quot;Animated gifs can breathe some much needed life into the imagery on your website. They <strong>grab the users attention and act as design delighters</strong>, making your site stand out from that of the competition.&quot;</p></blockquote>

<p>The same can be said for email, in which the 'stand out' -ness of a button or call to action can make a considerable difference to campaign results. Anna Yeaman at <a href="http://stylecampaign.com/">Style Campaign</a> demonstrated how an animated video preview <a href="http://www.campaignmonitor.com/blog/post/2920/lifting-your-click-through-rate-with-a-b-testing/">lifted her campaign's click-rate by 26%</a>... And there's no reason why you can't achieve the same.</p>

<h3>Support for animated GIFs in email</h3>

<p>The great news is that animated GIF support is pretty much universal across the major email clients... Except Outlook 2007 &amp; 2010 (you guessed it). In Outlook, only the first frame displays - which means that if your animation contains any important information, it has to feature on the first frame or risk being lost. Here are the full results:</p>

<table cellspacing="0" cellpadding="0" class="css" style="width:530px; margin-bottom: 20px; padding-bottom: 0;">
<tr class="header">
   <td class="element-header" style="width:140px">Desktop email clients</td>
   <td class="element-header">Result</td>                       
</tr>
<tr>
   <td class="element-style">Apple Mail</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                     
</tr>
<tr>
  <td class="element-style">Lotus Notes 6, 7 and 8.5</td>
  <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                    
</tr>
<tr>
  <td class="element-style">Outlook 2003, Express</td>
  <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>
</tr>
<tr>
   <td class="element-style">Outlook 2007, 2010</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/img.png" alt="No" />&nbsp;&nbsp;First frame displays</td>                                                                                  
</tr>
<tr>
   <td class="element-style">Outlook for Mac 2011</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                     
</tr>
<tr>
   <td class="element-style">Windows Live Mail 2011</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                     
</tr>
<tr class="header">
    <td class="element-header" style="width:140px">Web-based email clients</td>
    <td class="element-header">Result</td>
</tr>    
<tr>
   <td class="element-style">AOL Web</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                      
</tr>         
<tr>
   <td class="element-style">Gmail</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                         
</tr>
<tr>
   <td class="element-style">Hotmail</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>
</tr>
<tr>
   <td class="element-style">Yahoo! Mail</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                         
</tr>
<tr class="header">
    <td class="element-header" style="width:140px">Mobile email clients</td>
    <td class="element-header">Result</td>
</tr>    
       
<tr>
   <td class="element-style">Android (default)</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                         
</tr>
<tr>
   <td class="element-style">Android (Gmail)</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                         
</tr>
<tr>
   <td class="element-style">Blackberry</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                         
</tr>
<tr>
   <td class="element-style">iPhone</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/t2.png" alt="Yes" />&nbsp;&nbsp;GIF plays</td>                                                                                      
</tr>  
<tr>
   <td class="element-style">Windows Mobile 7</td>
   <td class="element-style"><img src="http://i3.campaignmonitor.com/uploads/images/img.png" alt="No" />&nbsp;&nbsp;First frame displays</td>                                                                                      
</tr>  
</table>

<p>Support for animated GIFs is rock solid. Compare this to support for <a href="http://www.campaignmonitor.com/blog/post/3529/html5-video-in-email-an-updated-guide-for-2011/ ">video</a> or <a href="http://www.campaignmonitor.com/blog/post/3626/christmas-email-template-2011/">CSS3 animation</a> and you'll see why the alternatives are seldom used.</p>

<h3>Examples from our customers</h3>

<p>We couldn't wrap up this post without a couple of great animated emails from folks like you. Click through on the images to see them animate:</p>

<h4><strong><a href="http://iartinteractive.com/en">iart interactive ag</a></strong></h4>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/j/07319557C51A1BDE/"><img src="http://i3.campaignmonitor.com/uploads/images/gallery/iartinteractiveag.jpg" style="border: 1px solid #ccc; padding: 5px;"></a></p>

<h4><strong><a href="http://claritycommunications.com.au/">Clarity Communications</a></strong></h4>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/r/7ABC2322DD48C1E4"><img src="http://i3.campaignmonitor.com/uploads/images/clarity.gif" style="border: 1px solid #ccc; padding: 5px;"></a></p>

<h4><strong><a href="http://www.hungrycastle.com/">Hungry Castle</a></strong></h4>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/r/B2C6682B3E29F5A5/"><img src="http://i3.campaignmonitor.com/uploads/images/gallery/buticlub.jpg" style="border: 1px solid #ccc; padding: 5px;"></a></p>

<h4><strong><a href="http://superbrothers.ca/">Superbrothers</a></strong></h4>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/r/19B5CB722D2C329E/"><img src="http://i3.campaignmonitor.com/uploads/images/gallery/superbrothers.png" style="border: 1px solid #ccc; padding: 5px; margin-bottom: 20px;"></a>
Style Campaign has a great selection of animated emails <a href="http://stylecampaign.com/blog/category/animated-emails/">in this blog post</a>, not to mention a <a href="http://www.theemailguide.com/email-marketing/animated-gifs-in-email-the-basics/ ">solid tutorial</a> so you can get started on your own animation creations!</p>

<p>We're really looking forward to seeing animated GIFs take off, both on the web and in email. So now, we'd like to hear from you - <strong>do you feature animated GIFs in your campaigns? Have any favorite examples?</strong> Share them with us in the comments below.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-04-12T04:53:23+00:00</dc:date>
    </item>

    <item>
      <title>Email: Just write about it!</title>
      <link>/blog/post/3702/email-just-write-about-it/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3702/email-just-write-about-it/</guid>
      <description><![CDATA[
			
							<p>The other day, I came across a timely post on Smashing Magazine, titled '<a href="http://www.smashingmagazine.com/2012/03/30/publish-what-you-learn/">Publish What You Learn</a>'. Timely, because I was amidst writing our recent post on <a href="http://www.campaignmonitor.com/blog/post/3694/removing-spacing-from-around-tables-in-outlook-2007-and-2010/">removing spacing from tables in Outlook</a>, knowing that this newly-discovered tip would be sure to help other email designers. While Smashing's post was focused on the benefits of sharing your web development know-how, I felt that the 'publish what you learn' mantra was even more relevant to email design, where the quirks are many, but often, information on email rendering issues is very thin on the ground.</p>

<p>Previously, I've encouraged customers to contribute to blogs, or better, start their own. In one case, the response was, 'Oh, but no-one would read a blog by little old me', which in my impression was shrugging off a good opportunity. In reality:</p>

<ul><li>There are only a handful of email design blogs out there, such as <a href="http://www.emaildesignreview.com/">Email Design Review</a>, <a href="http://www.stylecampaign.com">StyleCampaign</a>, <a href="http://emailfail.posterous.com/">Email Fail</a> and of course, this one. It's by no means an over-saturated field.</li>
<li>There aren't that many email marketing 'celebrities', either. This is a field where you can produce great work and stand out.</li>
<li>Blog posts on email design tend to get a lot of attention. In the last year, a single post on background images in email received over 62k hits from Google alone! That doesn't count all the reposting and tweeting that often occurs.</li></ul>

<p>The bottom line is, if you're designing for email and you come across a good piece of advice or a fix to some Outlook quirk, just publish it. Sharing what you know will not only help countless other people, but it could really lift your profile, too.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-04-04T07:13:13+00:00</dc:date>
    </item>

    <item>
      <title>Removing spacing from around tables in Outlook 2007 and 2010</title>
      <link>/blog/post/3694/removing-spacing-from-around-tables-in-outlook-2007-and-2010/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3694/removing-spacing-from-around-tables-in-outlook-2007-and-2010/</guid>
      <description><![CDATA[
			
							<p>Finally getting atop an annoying email rendering bug gives geeks like us near-endless, t-shirt removing satisfaction. Especially when it's plaguing our newsletters. In this instance, our adversary was 3px spacing to the left and right of tables with <code>align=""</code> applied to them. The stage was Outlook 2007 and 2010. While this has been a long-running issue, things really came to a head when I was coding our <a href="http://createsend.com/t/y-5B4E5413DAE0B54E">latest email newsletter</a>, only to find that two text boxes nested in a table would not sit alongside each other, thanks to said gaps:</p>

<p><img src="http://i3.campaignmonitor.com/uploads/images/with-gap-zoom.jpg" alt="Spacing around table in Outlook 2007" width="520" height="320" style="border: 1px solid #ccc; padding: 5px;" /></p>

<p>Using <code>align=""</code> to float tables alongside each other is starting to be used as an easy way to convert a regular 2 column email design to a 'wrapped' 1 column on mobile devices. We'll cover how to do this in the blog shortly.</p>

<p>Anyway, after an agonizing hour or so of trying to close the gaps with <code>padding</code> and <code>margin</code>, I scheduled the campaign and walked away in defeat, knowing all too well that our Outlook-using subscribers would see the awkward gaps. Yes, I'd coaxed the boxes to sit beside each other, but it just wasn't perfect. And anyone who knows how I code email designs knows that <i>not perfect</i> is simply <i>not good enough</i>.</p>

<p>Time passed and things settled down. That's until a customer <a href="http://www.campaignmonitor.com/forums">contacted us on the forums</a> about the same issue.</p>

<h3>Going gap-free</h3>

<p>Instantly, my primordial feelings, my white-knuckled combat response returned. "There's no workaround for this." I typed. It felt like one of those scenes where the righteous cop hands over his badge and gun, locked in an expression of both impotence and rage.</p>

<p>There <i>was</i> no workaround, until another customer chimed in.</p>

<p>Known only as dedra and slinging a line of <a href="http://msdn.microsoft.com/en-us/library/Aa155477">Microsoft Office proprietary CSS</a>, he had a <a href="http://www.campaignmonitor.com/forums/viewtopic.php?pid=24240#p24240">near-solution</a> - that is, using mso properties to control spacing between elements. The brain juices started flowing. I started googling around and found the answer tucked away on <a href="http://www.emailology.org">Emailology</a>, a genuine Aladdin's cave of email design treasure. 
To remove the spacing, simply add the following to your CSS styles...</p>

<p><style type="text/css">
.codeblock {
width:92%;
display:block;
padding:20px;
overflow:none;
word-wrap:break-word;
margin-top:20px;
margin-bottom:20px;
background: #ededed;
font-size: 0.8em;
}
</style></p>

<div class="codeblock"><code><span style="color: #000000">
<span style="color: #0000BB">table&nbsp;&#123;&nbsp;border</span><span style="color: #007700">-</span><span style="color: #0000BB">collapse</span><span style="color: #007700">:</span><span style="color: #0000BB">collapse</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">mso</span><span style="color: #007700">-</span><span style="color: #0000BB">table</span><span style="color: #007700">-</span><span style="color: #0000BB">lspace</span><span style="color: #007700">:</span><span style="color: #0000BB">0pt</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">mso</span><span style="color: #007700">-</span><span style="color: #0000BB">table</span><span style="color: #007700">-</span><span style="color: #0000BB">rspace</span><span style="color: #007700">:</span><span style="color: #0000BB">0pt</span><span style="color: #007700">;&nbsp;</span><span style="color: #0000BB">&#125;&nbsp;</span>
</span>
</code></div>

<p>... or inline it like so...</p>

<div class="codeblock"><code><span style="color: #000000">
<span style="color: #007700">&lt;</span><span style="color: #0000BB">table&nbsp;align</span><span style="color: #007700">=</span><span style="color: #DD0000">"left"&nbsp;</span><span style="color: #0000BB">style</span><span style="color: #007700">=</span><span style="color: #DD0000">"border-collapse:collapse;&nbsp;mso-table-lspace:0pt;&nbsp;mso-table-rspace:0pt;"</span><span style="color: #007700">&gt;&nbsp;...&nbsp;&lt;/</span><span style="color: #0000BB">table</span><span style="color: #007700">&gt;&nbsp;</span>
</span>
</code></div>

<p>... and the gaps will be no more. The end result is a great-looking email newsletter:</p>

<p><a href="http://createsend.com/t/y-5B4E5413DAE0B54E"><img src="http://i3.campaignmonitor.com/uploads/images/no-gaps-zoom-520.jpg" alt="No gaps in Outlook 2007" width="520" height="381" style="border: 1px solid #ccc; padding: 5px;" /></a></p>

<p>Many thanks to <a href="http://www.emailology.org">Emailology</a>, the mysterious dedra and all our customers on the forums for this fix. We're now free to create responsive email designs with floating tables, that look just as lovely in Outlook 2007 and 2010, as in any other email client.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-04-03T06:03:45+00:00</dc:date>
    </item>

    <item>
      <title>RSS to Email now available for PAYG customers</title>
      <link>/blog/post/3690/rss-to-email-payg/</link>
      <author>David Greiner</author>
      <guid>/blog/post/3690/rss-to-email-payg/</guid>
      <description><![CDATA[
			
							<p>It's been just over a month since we <a href="http://www.campaignmonitor.com/blog/post/3662/rss-to-email-reinvented/">announced RSS to Email support</a> in Campaign Monitor. The response since then has been crazy positive, with <strong>more than 125,000 RSS campaigns already delivered</strong> and some stunning <a href="http://www.campaignmonitor.com/create/rss-to-email/">custom RSS template designs</a> starting to surface (we'll feature some of these here soon).</p>

<p>The one catch when we launched last month was that RSS to Email was only available for customers on monthly plans. It was <a href="http://www.campaignmonitor.com/blog/post/3662/rss-to-email-reinvented/#comments">pretty clear</a> from the day we launched that our PAYG customers were keen to get in on some RSS action too, and so we immediately started working on making the feature available to everyone. Today I'm happy to announce that RSS to Email is now available for our PAYG customers too.</p>

<h3>Making sure your subscribers don't miss out</h3>

<p>Like any complex feature, there are always lots of small gotchas we need to be aware of when it comes to billing. For example, what happens if we try and send today's recurring RSS campaign for you, but you got a little carried away with your Apple obsession and the funds aren't available on your credit card? There are lots of reasons a charge might not be approved, but we wanted to give you a quick way to resolve these issues without forcing your subscribers to miss out on your daily goodness.</p>

<p>So, if a payment fails for some reason when sending a recurring RSS campaign for PAYG customers, we'll let you know immediately and give you a grace period to get to the bottom of it. We'll send you an email explaining exactly what happened, and if you manage to get that issue resolved within a time period (2 hours for daily, 4 for weekly and 12 for monthly), we'll automatically send the email for you.</p>

<p>If for some reason you can't get it sorted in the grace period, the next campaign we send will include any new content, plus the older content your subscribers would have missed because of the failed charge. There are lots of other contingencies our engineering and QA team feverishly tracked down (they really are awesome) - rest assured we'll do our best to handle things in an elegant manner.</p>

<h3>A quick refresher</h3>

<p>If you happened to miss the <a href="http://www.campaignmonitor.com/blog/post/3662/rss-to-email-reinvented/">full announcement last month</a>, here's a quick demo video to give you an overview of what all the fuss is about...</p>

<div style="margin:25px 0 25px -166px;">
<iframe src="http://player.vimeo.com/video/36470111?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff" width="705" height="397" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
</div>

<p>This update is the perfect example of just how much we rely on your feedback to drive where we take Campaign Monitor. Feedback via blog comments, tweets and personal emails started rolling in as soon as we launched RSS support, which made it very easy to prioritise and get it out the door as quickly as possible. We're always listening, so please, keep it coming.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-28T20:20:33+00:00</dc:date>
    </item>

    <item>
      <title>Changes to how &#8216;new look&#8217; Gmail displays backgrounds</title>
      <link>/blog/post/3686/changes-to-how-gmail-displays-backgrounds/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3686/changes-to-how-gmail-displays-backgrounds/</guid>
      <description><![CDATA[
			
							<p>Amongst the <a href="http://www.campaignmonitor.com/blog/post/3652/gmail-strips-out-inline-css/">moving and shaking</a> that's come with Gmail's '<a href="http://mail.google.com/mail/help/newlook.html">new look</a>' have been a couple of changes to how this email client handles background colors and images. To some of you this may be old news, but for many it may change the way you design for this notoriously finicky client. So here goes.</p>

<h3>Gmail now supports <code>background-image</code></h3>

<p>Although it's but a small victory, it looks like Gmail has expanded its CSS support to encompass the <code>background</code> and <code>background-image</code> properties. This means that you can now define background images for elements like table cells and divs, leaving Hotmail, Outlook 2007+ and Lotus Notes as the <a href="http://www.campaignmonitor.com/css/">only major clients that don't support</a> what's a fairly fundamental CSS property. Thankfully, there's a hack for <a href="http://www.campaignmonitor.com/blog/post/3363/updated-applying-a-background-image-to-html-email/">background images in Outlook 2007/2010</a>, so it's up to you to make the call - do you design with background images in mind (and a fallback color)? Or play it safe?</p>

<p>Note that <code>background-position</code> and <code>background-repeat</code> are still not supported - only images, for now.</p>

<h3>Background colors or images are now a must</h3>

<p><img src="http://i3.campaignmonitor.com/uploads/images/background-vs-no-1.jpg" alt="Themed preview pane in Gmail" width="385" height="285" align="right" style="padding: 5px; margin: 0 0 10px 15px; border: 1px solid #ccc;" /></p>

<p>With <a href="http://support.google.com/mail/bin/answer.py?hl=en&answer=112508">Gmail's new themes</a> (which I have to admit, are very pretty), have been changes to how email newsletters appear in the preview pane. With themes activated, the preview pane is actually semi-transparent, allowing the theme to show through. The only way to fix this is to nest your design in a full-width table, for example <code>&lt;table width="100%" bgcolor="#FFFFFF" ... &gt;</code>, thus providing an opaque background for your content. Pictured is an example of content inside and outside of a table with a background color, as seen in Gmail's themed inbox.</p>

<p>Many thanks to Responsys for their post, '<a href="http://www.responsys.com/blogs/nsm/2012/03/workaround-for-gmail-theme-background-translucency.html">Workaround for Gmail Background Translucency</a>' and our keen customers who wrote in about background image support. If you've seen any news and notable changes in Gmail, or have your own tip for working with backgrounds, be sure to let us know in the comments below.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-27T15:21:50+00:00</dc:date>
    </item>

    <item>
      <title>A mobile&#45;optimized email subscribe form in action</title>
      <link>/blog/post/3685/action-rocket-rebrand-mobile-friendly-pre-launch-page/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3685/action-rocket-rebrand-mobile-friendly-pre-launch-page/</guid>
      <description><![CDATA[
			
							<p><a href="http://actionrocket.co/"><img src="http://i3.campaignmonitor.com/uploads/images/actionrocket-1.jpg" alt="Action Rocket on the iPhone" width="250" height="490" align="right" style="margin: 0 0 15px 15px;" /></a>
Just last week, our blog post on '<a href="http://www.campaignmonitor.com/blog/post/3643/improving-the-usability-of-email-subscribe-forms-on-mobile-devices/">Improving the usability of email subscribe forms on mobile devices</a>' gained quite a bit of interest. But what was particularly gratifying to us was seeing some of its lessons being put into action - by an upcoming <a href="http://www.campaignmonitor.com/features/re-brand-re-sell-and-profit/">Campaign Monitor rebrand</a>, no less!</p>

<p>Cool customer <a href="http://www.elliot-ross.co.uk/">Elliot Ross</a> (of <a href="http://www.emaildesignreview.com/">Email Design Review</a> fame) recently took a responsive approach to designing the pre-launch page for <a href="http://actionrocket.co/">Action Rocket</a>, a new email design studio. What makes the page unique is how gracefully it adapts for use on mobile devices (pictured), courtesy of <a href="http://www.campaignmonitor.com/blog/post/3643/improving-the-usability-of-email-subscribe-forms-on-mobile-devices/">our little form template</a>.</p>

<h3>Email form validation with CSS3</h3>

<p>Scaling for the small screen aside, this email subscribe form has two features that considerably improve its usability, both of which were achieved by using <code>input type="email"</code> on the Email: field. First of all, using the attribute, <code>type="email"</code> results in the special, email address-specific keyboard being displayed on iOS devices. But secondly, it means that the <a href="https://developer.mozilla.org/en/CSS/%3Ainvalid"><code>:invalid</code> CSS3 pseudo-class</a> can be used to highlight the field if it doesn't <a href="https://developer.mozilla.org/en/HTML/HTML5/Constraint_validation">validate properly</a>. Here's a sample of the CSS code used:</p>

<p><style type="text/css">
.codeblock {
width:92%;
display:block;
padding:20px;
overflow:none;
word-wrap:break-word;
margin-top:20px;
margin-bottom:20px;
background: #ededed;
font-size: 0.8em;
}
</style></p>

<div class="codeblock"><code><span style="color: #000000">
<span style="color: #0000BB">input</span><span style="color: #007700">:</span><span style="color: #0000BB">invalid</span><span style="color: #007700">,&nbsp;</span><span style="color: #0000BB">textarea</span><span style="color: #007700">:</span><span style="color: #0000BB">invalid&nbsp;&#123;&nbsp;background</span><span style="color: #007700">-</span><span style="color: #0000BB">color</span><span style="color: #007700">:&nbsp;</span><span style="color: #FF8000">#f0dddd;&nbsp;&#125;&nbsp;</span>
</span>
</code></div>

<p>In times past, developers have long had to roll-their-own client-side validation using JavaScript, but with CSS3, all it takes is a snippet of code. Find out more about form validation on A List Apart's '<a href="http://www.alistapart.com/articles/forward-thinking-form-validation/">Forward Thinking Form&#160;Validation</a>'.</p>

<h3>Taking pre-launch pages to the next level</h3>

<p>We've previously covered <a href="http://www.campaignmonitor.com/blog/post/3560/set-up-a-free-pre-launch-page-with-launching.me/">how to build basic pre-launch pages</a> and <a href="http://www.campaignmonitor.com/blog/post/3431/tutorial-how-to-create-a-viral-social-media-email-subscribe-form/">add social sharing</a> to them. With smart phones becoming increasingly ubiquitous, it makes a lot of sense to go the next step and make the email subscribe forms therein as mobile-friendly as they can be - <a href="http://www.campaignmonitor.com/blog/post/3643/improving-the-usability-of-email-subscribe-forms-on-mobile-devices/">we've even provided the code</a> to help you get started.</p>

<p>Besides, what's a better way to show clients that you understand responsive design, than to create a responsive site?</p>

<p>Many thanks to Elliot and Action Rocket for sharing this great example with us. If you have a great tip or hack for improving the usability of your forms, be sure to let us know.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-22T17:08:56+00:00</dc:date>
    </item>

    <item>
      <title>5 beautiful designs from our template builder</title>
      <link>/blog/post/3678/5-beautiful-designs-from-our-template-builder/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3678/5-beautiful-designs-from-our-template-builder/</guid>
      <description><![CDATA[
			
							<p>Since we <a href="http://www.campaignmonitor.com/blog/post/3586/a-new-way-to-build-email-templates/">introduced the template builder</a>, our customers have used it to quickly whip up reusable designs with unbelievable gusto. <strong>Over 53,000 email templates</strong> have been created in the 5 months since we added it to all Campaign Monitor accounts, resulting in enough campaigns to span from here to the <a href="http://voyager.jpl.nasa.gov/">Voyager probe</a>. Actually, I just made that one up, but you get the idea.</p>

<p>Sheer quantity of templates aside, the quality of email campaigns that have been built from template builder creations has really blown us away. So much so, that we'd like to share a few of our favorites with you. If these don't inspire you to get cracking on a full-blown design in half the time, then I don't know what will.</p>

<h3>Jake Hamilton Music</h3>

<p><strong>Designer:</strong> <a href="http://MinistryPixel.com">MinistryPixel.com</a></p>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/r/9BE457A8B115B742/"><img src="http://i3.campaignmonitor.com/uploads/images/jake-hamilton-520.jpg" alt="Jake Hamilton, by MinistryPixel" width="520" style="padding: 5px; border: 1px solid #ccc;" /></a></p>

<p>This is a newsletter that won't be ignored. From the vibrant header image featuring the new <a href="http://jakehamiltonmusic.com">Jake Hamilton website</a>,  to the passionate copy, there's a lot to like about this elegant, stripped-back newsletter. Ups to <a href="http://MinistryPixel.com">MinistryPixel.com</a> for this uplifting design.</p>

<h3>Antony Hare, P.I.</h3>

<p><strong>Designer:</strong> <a href="http://ahpi.ca">Antony Hare, P.I.</a></p>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/y/CB4F3537742133BF/"><img src="http://i3.campaignmonitor.com/uploads/images/antony-hare-520.jpg" alt="Antony Hare, P.I." width="520" style="padding: 5px; border: 1px solid #ccc;" /></a></p>

<p>Private illustrator, designer and wordsmith <a href="http://ahpi.ca">Antony Hare</a> has shown that saving time with the template builder doesn't mean cutting corners. Complimenting his work for major publications like the New York Times is this graphic (and oh-so-polite) email update... With just a touch of <i>noir</i>. For more of his charismatic illustrations, <a href="http://ahpi.ca">swing by his site</a>!</p>

<h3>Arkana</h3>

<p><strong>Designer:</strong> <a href="http://www.pixeo.be">Pixeo</a></p>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/r/D16E95EA5E5C632C/"><img src="http://i3.campaignmonitor.com/uploads/images/arkana-520.jpg" alt="Arkana, by Pixeo and Emeka" width="520" style="padding: 5px; border: 1px solid #ccc;" /></a></p>

<p>We see a disproportionate amount of great design come from Belgium and the Netherlands; this template from <a href="http://www.pixeo.be">Pixeo</a> and <a href="http://emeka.be">Emeka</a> is a great example of this trend. Featuring a pleasing color scheme and a header image that adds a great dynamism to the one-column design, this is an attractive campaign in any language.</p>

<h3>Image & Design Studio / 27Digital</h3>

<p><strong>Designer:</strong> <a href="http://i-d.com.au/">Image &amp; Design Studio</a></p>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/r/2ED7C7120557C1FF/"><img src="http://i3.campaignmonitor.com/uploads/images/27id-520.jpg" alt="Image & Design Studio / 27Digital" width="520" style="padding: 5px; border: 1px solid #ccc;"/></a></p>

<p>This newsletter gets our stamp of approval for a couple of reasons. The crisp, 3D-rendered header image, the use of color, the description of what's to come and the funny permission reminder roll together to make a thoroughly personal, fun and engaging campaign. It's official - the teams at <a href="http://i-d.com.au/">Image &amp; Design Studio</a> / <a href="http://27digital.com.au/">27Digital</a> really know how to leave their mark when it comes to email design!</p>

<h3>The Hoopla Family</h3>

<p><strong>Designer:</strong> <a href="http://www.hooplafamily.com.au/">The Hoopla Family</a></p>

<p><a href="http://gallery.campaignmonitor.com/ViewEmail/r/E0848C34A9E78FC2/"> <img src="http://i3.campaignmonitor.com/uploads/images/hoopla-family-520-1.jpg" alt="The Hoopla Family" width="520" style="padding: 5px; border: 1px solid #ccc;"/></a></p>

<p>Like a modern-day brag book, this 'Pool Room' email by <a href="http://www.hooplafamily.com.au/">The Hoopla Family</a> contains the best of what this Australian design agency has to offer, or as they say, all killer and no filler. Showcasing the antics of a rather multidisciplinary bunch, it contains images that have been specially created for this newsletter, personable copy and a thick slather of Australiana - from the  title (a nod to the classic Australian movie, '<a href="http://www.imdb.com/title/tt0118826/">The Castle</a>') to a guest appearance by one of our more flamboyant footballers, <a href="http://en.wikipedia.org/wiki/Warwick_Capper">Warwick Capper</a>. Overall, this is a template builder original, through and through.</p>

<p>Thank you for checking out our template builder round up - we should do this again, sometime! Hopefully this has given you the inspiration to try your hand at creating a unique template for yourself or your clients. After all, they're automatically <a href="http://www.campaignmonitor.com/blog/post/3593/create-mobile-friendly-email-templates-in-one-click/">optimized for both big and small screens alike</a> and are ready to use in fraction of the time it would take to build a similar template from scratch. So why not kick the tyres by <a href="http://help.campaignmonitor.com/topic.aspx?t=210">rolling your own template</a>?</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-20T16:21:33+00:00</dc:date>
    </item>

    <item>
      <title>Improving the usability of email subscribe forms on mobile devices</title>
      <link>/blog/post/3643/improving-the-usability-of-email-subscribe-forms-on-mobile-devices/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3643/improving-the-usability-of-email-subscribe-forms-on-mobile-devices/</guid>
      <description><![CDATA[
			
							<p><a href="http://i3.campaignmonitor.com/uploads/images/mobile-friendly-large.jpg"><img src="http://i3.campaignmonitor.com/uploads/images/mobile-friendly.jpg" alt="Mobile-friendly form" width="250" height="490" align="right" style="margin: 0 0 10px 15px;" /></a></p>

<p>Recently, we were asked for advice on how to make our <a href="http://help.campaignmonitor.com/topic.aspx?t=13">email subscribe forms</a> more mobile-friendly. The good news is that mobile devices like iPhone and Android handsets generally do a good job of making forms at least remotely usable these days, however there are a couple of things us designers and coders can do to make them as easy-to-use as possible. The obvious benefit to optimizing your forms is that they require less time and effort to fill in on a mobile device. To you, this means higher completion rates and more subscribers.</p>

<p>In this post, we'll cover a couple of pointers, plus feature a simple example you can use as a starting point for your own subscribe forms.</p>

<h3>Top-align those labels</h3>

<p>A common boo when it comes to using forms on a mobile device are having labels that reside out of sight when a form field is selected in a mobile browser. At the initial zoom-level, a left-aligned label like 'Enter your email address:' may be visible, but as soon as you start entering text, the viewport zooms-in and the label is flung out of sight.</p>

<p>The solution is to either use a <a href="http://www.smashingmagazine.com/2010/03/11/forms-on-mobile-devices-modern-solutions/">top-aligned label</a>, or <a href="http://blog.stannard.net.au/2011/01/07/creating-a-form-with-labels-inside-text-fields-using-jquery/">add the form label as a text-field value</a>. The latter requires less vertical real estate, but can be a little annoying if the field you've just started filling in was initially hidden by the phone's "Form Assistant" or keyboard.</p>

<p>Our subscribe forms come with top-aligned labels by default - which is a good thing.</p>

<h3>Use input type="email"</h3>

<p>Talking about form assistants, Kevin in the comments made a great suggestion - if you use <code>input type="email"</code> on the email address form field, a special keyboard will display in iOS devices, featuring commonly used characters like @. David Walsh features a couple of added advantages to this method in his post on <a href="http://davidwalsh.name/html5-email">HTML5&#8242;s &#8220;email&#8221; and &#8220;url&#8221; Input&#160;Types</a>. Thanks, Kevin!</p>

<h3>Narrow down your forms (if not the entire site)</h3>

<p>We've spent a lot of posts talking about <a href="http://www.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/">designing responsive layouts</a> for email using CSS, but now we're talking about the web, it's possible to do away with the usual caveats on poor CSS support on Android devices and all that. A grand vista has opened up. We are free.</p>

<p>I'm sure I'm not the only one that takes great pleasure visiting <a href="http://colly.com/comments/carry_on_responsively/">Colly-style responsive sites</a> on a mobile device. The good news is that the same techniques that are applied to sites can be used on individual forms, too. Adding mobile-specific CSS using <code>@media</code> queries to go narrow-gauge and remove visual clutter can really improve the usability of forms. After all, there's nothing more clunky than having half a text-input field disappear off the screen.</p>

<p>Personally, I favor using <a href="http://woorkup.com/2010/01/10/best-practices-to-develop-perfect-websites-for-iphone-and-mobile-devices/">fluid layouts</a> for mobile devices, simply because you can't predict the viewport's dimensions or orientation. Simply making a text field's width say, 80% of the viewport width can massively improve the appearance and usability of our subscribe forms.</p>

<p><img src="http://i3.campaignmonitor.com/uploads/images/lightbox.jpg" alt="Lightboxes - egads!" width="250" height="490"align="right" style="margin: 0 0 10px 15px;" /></p>

<h3>No love for lightboxes</h3>

<p>I'm sure there are tasteful <a href="http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/super-simple-lightbox-with-css-and-jquery/">email subscribe form lightboxes</a> that have been optimized for use on mobile devices. But 99% of the time, they make sites almost impossible to use on smaller screens. Make sure you test your lightboxes on a mobile device before you use them in this manner.</p>

<h3>Be mindful of multi-option fields</h3>

<p>While we're talking about narrow layouts, it's prudent to force all content to flow in a single column - particularly checkboxes. When inline form options wrap, things can get all kinds of hairy. Often drop-down lists are a better option over radio buttons and reduce the amount of scrolling required to navigate the form.</p>

<h3>Take a stand on scale</h3>

<p>Finally, a lot of these tips here haven't been specific to forms - more like web design in general. Included is the idea of setting the initial scale/zoom on a mobile device using a viewport meta tag, especially when building stand-alone forms. When applied, they can prevent the user accidentally zooming in unnecessarily and losing sight of most of the form. Here's what a typical viewport meta tag looks like in the head of an HTML page:</p>

<p><style type="text/css">
.codeblock {
width:92%;
display:block;
padding:20px;
overflow:none;
word-wrap:break-word;
margin-top:20px;
margin-bottom:20px;
background: #ededed;
font-size: 0.8em;
}
</style></p>

<div class="codeblock"><code><span style="color: #000000">
<span style="color: #007700">&lt;</span><span style="color: #0000BB">meta&nbsp;name&nbsp;</span><span style="color: #007700">=&nbsp;</span><span style="color: #DD0000">"viewport"&nbsp;</span><span style="color: #0000BB">content&nbsp;</span><span style="color: #007700">=&nbsp;</span><span style="color: #DD0000">"width&nbsp;=&nbsp;device-width,&nbsp;user-scalable&nbsp;=&nbsp;no"&nbsp;</span><span style="color: #007700">/&gt;&nbsp;</span>
</span>
</code></div>

<p>For a couple of variants on this, check out <a href="https://developer.mozilla.org/en/Mobile/Viewport_meta_tag">Mozilla's docs</a>.</p>

<h3>Check out our sample form</h3>

<p>We decided to collect a couple of these tips and quickly mock up a simple CSS template that you can plonk our 'Basic formatting' subscribe form code into. You can view it in your browser and on your mobile device using this short link: <a href="http://bit.ly/cm-mob-form ">bit.ly/cm-mob-form</a>.</p>

<p>Feel free to repurpose the CSS, play with the <code>@media</code> queries and use it either as a stand-alone form, or on your pages. Thanks to <a href="http://twitter.com/buzzusborne">Buzz</a> for providing a starting-point for this form.</p>

<p>Now, I'm a lazy coder and this is far from an exhaustive list of form usability tips. <br /><strong>Can you suggest some more ways to optimize subscribe forms for mobile devices? Share them with us below.</strong></p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-15T16:52:21+00:00</dc:date>
    </item>

    <item>
      <title>On handling email campaign bounces and out&#45;of&#45;office replies</title>
      <link>/blog/post/3677/handling-email-campaign-bounce-backs-and-autoreplies/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3677/handling-email-campaign-bounce-backs-and-autoreplies/</guid>
      <description><![CDATA[
			
							<p>Recently, one of our customers sent in a ream of despair, which essentially amounted to: <i>"If I send a campaign to my entire list at once, my inbox is instantly swamped with bounce notifications and out-of-office replies. What do I do?"</i></p>

<p>Given that using a <a href="http://www.campaignmonitor.com/blog/post/3550/why-no-reply-address-is-an-email-marketing-no-no/">no-reply address is an email marketing no-no</a>, it's essential that replies to your campaigns end up in a monitored mailbox. This means pointing the From: and Reply-to: email addresses in your campaigns to a real email address, read by real people. After all, even the most humble announcement can attract important emails, like sales leads, customer feedback and regularly, unsubscribe requests.</p>

<h3>Dedicate an email address to replies</h3>

<p>Of course, receiving a squillion replies and bounce-backs to your regular work address can be immensely frustrating, especially if they trickle in over a period of hours, or days. So setting up a new, From/Reply-to email address to handle replies (like <i>info@yourdomain.com</i>) is always a good idea. If you're already using Google Apps, <a href="http://support.google.com/a/bin/answer.py?hl=en&answer=33310">this is dead-easy to do</a> yourself - otherwise, ask your tech team for a hand.</p>

<p>Once you've set up an email account, you can <a href="http://support.google.com/mail/bin/static.py?hl=en&ts=1668960&page=ts.cs">set it up in your regular email client</a> and sift away. Note that replies can go to either the From: or Reply-to: address (depending on the recipient's email client), so you can count on bounces, out-of-office replies and more going to either specified address.</p>

<h3>Rules rule</h3>

<p><img src="http://i3.campaignmonitor.com/uploads/images/filter-2.jpg" alt="Creating a filter in Gmail" width="294" height="425" align="right" style="border: 1px solid #ccc; padding: 5px; margin: 0 0 15px 15px;" />Once you've got a unique email address for replies, it's time to separate the wheat from the chaff (or human from robot-generated email). Doing this manually can be a laborious (read: boring) process, so often the best thing to do is to create a folder in your newly-minted email account and siphon all automated 'robot replies' into it, leaving only the important emails in the inbox. This can be done using <a href="http://support.google.com/mail/bin/answer.py?hl=en&answer=6579#1">rules (or filters)</a>, which can be created in many of the major email clients, like Gmail, OSX Mail, Outlook and more. For example, you may create rules like...</p>

<p><code>IF email subject includes:</p>

<ul><li>"Out of office"</li>
<li>"Out of the office"</li>
<li>autoreply</li>
<li>"Delivery Status Notification"</li>
<li>"message status - undeliverable"</li></ul>

<p>OR email content includes:</p>

<ul><li>"no longer working at"</li>
<li>"unattended mailbox"</li></ul>

<p>THEN move the email to my 'Robot Replies' folder.</code></p>

<p>This isn't a definitive list and ultimately, you'll find yourself adding and refining rule criteria as you go along. Rules can also come in handy for highlighting or flagging important messages, such as those with "unsubscribe" in the subject line.</p>

<h3>Make it a morning ritual</h3>

<p>The final step is of course, regularly checking your reply address. Back when I was a hand at a marketing agency, we sent multiple campaigns / large email volumes every day and had a dedicated 'reply machine' for dealing with bounces. While with smaller sends you will most probably be able to deal with replies from the comfort of your desktop email client, you may want to take a more distant approach if you're a massive sender (as we were) and simply check in once or twice a day. Make it a routine, cup of coffee in hand, even if its been days after your last send. Sometimes relevant emails get filtered out too, so remember to give your 'Robot Replies' folder a skim before you hit 'Delete All'.</p>

<p>We'd like to know your approach to automated responses - <strong>do you have a killer tip for dealing with replies? Let us know in the comments below.</strong></p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-13T16:31:49+00:00</dc:date>
    </item>

    <item>
      <title>Introducing One&#45;Click Content</title>
      <link>/blog/post/3663/one-click-content/</link>
      <author>David Greiner</author>
      <guid>/blog/post/3663/one-click-content/</guid>
      <description><![CDATA[
			
							<p>We're lucky enough to get a constant stream of feedback and feature requests from customers. We record every little piece of it, and this forms a crucial part of how we decide what features to add next to Campaign Monitor.</p>

<p>When we made the call to offer some kind of RSS to Email support, we sat down to review the hundreds of requests, some going back years. Personally, I was expecting everyone to ask for the <a href="http://www.campaignmonitor.com/rss-to-email/">traditional RSS to Email</a> functionality&#8212;you update your site or blog, we send that new content to your subscribers on a recurring basis. To my surprise, this only accounted for around half of the votes. Of course, we still built this feature, which we <a href="http://www.campaignmonitor.com/blog/post/3662/rss-to-email-reinvented/">announced a few days back</a>. It turns out the other half were looking for something else.</p>

<p>Instead of automatically sending your content, many of you wanted an easy way to get that content into your existing newsletters. Nobody likes writing something twice. Maybe you want to include specific blog posts, or it's secondary content like a sidebar of upcoming events you'll be hosting. The important thing is, that content exists somewhere else and you want to use it in a campaign.</p>

<p>If that's you, you're going to love One-Click Content. Here's a quick video of it in action...</p>

<div style="margin:25px 0 25px -166px;">
<iframe src="http://player.vimeo.com/video/37995818?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff" width="705" height="397" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
</div>

<h3>How it works</h3>

<p>If you caught our recurring RSS <a href="http://www.campaignmonitor.com/blog/post/3662/rss-to-email-reinvented/">announcement</a> last week, you would have seen that we've added a new kind of repeater to our <a href="http://www.campaignmonitor.com/create/rss-to-email/">template language</a>. Known as a <code>datarepeater</code>, it lets you reference an external RSS feed and then display the content any way you see fit.</p>

<p>The cool part is, you can actually add <code>datarepeater</code>'s to any <a href="http://www.campaignmonitor.com/create/editable-content/">regular email templates</a> too. Just point the <code>datarepeater</code> to your blog or RSS feed, design how you want the content to appear in the email, and with a single click your content is imported into your campaign and ready to send. You can even have multiple <code>datarepeater</code> and regular <code>repeater</code> tags in a single template.</p>

<p>Let's say, for example, that you publish a blog called Signal vs. Noise. You occasionally send a newsletter, and would like to include some of your blog content in each issue. Just add the following code to your template...</p>

<div style="background: #f1f1f1;padding:5px 15px;margin-bottom:20px;">
<code><pre>&lt;datarepeater type="rss" src="http://www.37signals.com/svn/"&gt;
    &lt;rsstitle/&gt;
    By &lt;rssauthor/&gt;
    &lt;rssbody paragraphs="1"&gt;&lt;/rssbody&gt;
    &lt;rssitemlink&gt;Read more...&lt;/rssitemlink&gt;
&lt;/datarepeater&gt;
</pre></code>
</div>

<p>In this code we're referencing our blog with the <code>src</code> attribute, and then displaying the title of each post, plus the author and the first paragraph of the post itself, followed by a "Read more" link that points to the full post on our site. There are lots of other content options, such as images, enclosures, dates, comments and more, which are all covered in our lovely <a href="http://www.campaignmonitor.com/create/rss-to-email/">new documentation</a>. You can even use alternating designs for each item in the feed via our <a href="http://www.campaignmonitor.com/create/rss-to-email/#layout"><code>layout</code></a> tag.</p>

<h3>What you'll see in the editor</h3>

<p>Whenever you create a regular campaign and select this template, you'll see this nice blank slate in the editor. You can click the image for a larger version.</p>

<p><a href="http://i3.campaignmonitor.com/uploads/images/customers/37s-1.png"><img src="http://i3.campaignmonitor.com/uploads/images/customers/37s-1-small.png" style="border: 0;" alt="image" width="530" height="415" /></a></p>

<h3>Click, Choose, Send</h3>

<p>Clicking the the "Load posts" button will show the most recent posts from this RSS feed in the sidebar of the editor. You can also see an instant preview of how this content looks in my campaign.</p>

<p><a href="http://i3.campaignmonitor.com/uploads/images/customers/37s-2.png"><img src="http://i3.campaignmonitor.com/uploads/images/customers/37s-2-small.png" style="border: 0;" alt="image" width="530" height="415" /></a></p>

<p>You can then choose exactly which posts I'd like included, click "Done" and my campaign is good to go. Because of the ubiquity of RSS, there are so many ways you can use this feature. Here are a just a few quick examples of the sort of content you might want to automatically import:</p>

<ul>
<li>The last 4 posts from your blog</li>
<li>Your upcoming events on Eventbrite</li>
<li>Your 5 most recent tweets</li>
</ul>

<p>Getting started is easy, and we've put together a sample template to help you get started even faster.</p>

<h4 style="background:#edf5ff;padding:15px;border:1px solid #e2eefc;"><a href="http://www.campaignmonitor.com/create/rss-to-email/"><img src="http://i3.campaignmonitor.com/uploads/images/customers/RSS-icon.png" alt="image" width="24" height="23" style="float:left;margin-right:10px;border: 0;" /></a><a href="http://www.campaignmonitor.com/create/rss-to-email/">View the RSS template language <span style="font-weight:normal">and</span> download a sample template</a></h4>

<h3>Leave your options open</h3>

<p>If you're using One-Click Content for a client, we recommend making it crazy simple by specifying the address of their site or RSS feed in the <code>datarepeater</code> tag. As I mentioned earlier, you do this via the <code>src</code> attribute, for example:</p>

<div style="background: #f1f1f1;padding:5px 15px;margin-bottom:20px;">
<code><pre>&lt;datarepeater type="rss" src="http://www.client.com/rss"&gt;</pre></code>
</div>

<p>If you'd prefer to leave options open for yourself, or a more savvy client, you can leave out the optional <code>src</code> attribute. If you leave it blank, we'll let you choose an RSS feed right there in the editor. Here's the code:</p>

<div style="background: #f1f1f1;padding:5px 15px;margin-bottom:20px;">
<code><pre>&lt;datarepeater type="rss"&gt;</pre></code>
</div>

<p>Because an <code>src</code> hasn't been provided, clicking on the "Load posts" button will let you enter the web site or RSS feed you'd like the content to come from:</p>

<p><a href="http://i3.campaignmonitor.com/uploads/images/customers/choose-feed.png"><img src="http://i3.campaignmonitor.com/uploads/images/customers/choose-feed-small.png" style="border: 0;" alt="image" width="530" height="293" /></a></p>

<p>As soon as you enter the web site, we'll grab the feed contents and let you select what you'd like included. Again, click the image for a larger version.</p>

<p><a href="http://i3.campaignmonitor.com/uploads/images/customers/choose-posts.png"><img src="http://i3.campaignmonitor.com/uploads/images/customers/choose-posts-small.png" style="border: 0;" alt="image" width="530" height="358" /></a></p>

<p>We're also working hard on supporting other data formats on top of RSS to open even more possibilities for importing your content into your campaigns. We've got big plans, and more details on this will be coming soon.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-06T20:03:01+00:00</dc:date>
    </item>

    <item>
      <title>A new approach to email authentication</title>
      <link>/blog/post/3671/email-authentication/</link>
      <author>David Greiner</author>
      <guid>/blog/post/3671/email-authentication/</guid>
      <description><![CDATA[
			
							<p>In a little under two weeks, we'll be making a subtle change to the way we handle email authentication in Campaign Monitor. For those of you new to the concept, email authentication tells your subscribers it's OK for our servers to send email on your behalf. It can help you avoid spam filters, and also proves your email isn't a forgery. All good things.</p>

<p>Right now, email authentication is an opt-in kind of thing. It's not on by default, but we've tried to make it as painless as possible to set up. The problem is, it's still pretty painful. For starters, you need to have access to the DNS records for your domain. In many cases that can rule this process out, or at the very least start your eyes glazing over.</p>

<p>The trouble is, this stuff is important. So, we're taking a different approach. <strong>Starting Monday, March 26 we'll be turning on email authentication for everyone.</strong></p>

<h3>A small change in Outlook</h3>

<p>If you've already set up your own authentication, we're not changing a thing. For those of you that haven't, there's one small change that we want you to be aware of. Because we'll be authenticating on your behalf, we add a couple of new details to the header of any emails you send. To the vast majority of your subscribers, this won't change a thing. But, there is a subte change your Outlook subscribers may notice. Here's what they'll see:</p>

<p><img src="http://i3.campaignmonitor.com/uploads/images/customers/authentication.png" alt="How authenticated emails appear in Outlook" width="693" height="233" style="margin-left:-155px;border: 0;" /></p>

<p>It's the extra from address and <em>on behalf of</em> that I highlighted in yellow that's new here. Because we're authenticating for you, we need to include our own domain in your mal headers/ Outlook lets their users know this at the top of the email. It's also worth pointing out we'll only ever use our white label domains when sending on your behalf - there's never any mention of Campaign Monitor. It's also worth adding that this small snippet is something any Outlook user would already have seen at the top of countless emails in the past. We think it's a small price to pay to help avoid spam filters and ensure your email never appears to be a forgery.</p>

<h3>Alternate options</h3>

<p>If you're not crazy about the "on behalf of" snippet, we've made it nice and easy to opt-out of us authenticating for you. Remember, we won't start this until March 19, so you have some grace time. To change this setting, just head into "Client Settings" and click on the new "Authentication Settings" in the sidebar. Here's what you'll see (click for full-size):</p>

<p><a href="http://i3.campaignmonitor.com/uploads/images/customers/authent2-large.png"><img src="http://i3.campaignmonitor.com/uploads/images/customers/authent2.png" style="border: 0;" alt="image" width="530" height="357" /></a></p>

<p>By default, "Authenticate all emails for me" will be checked. If you'd like to opt-out, you have two options...</p>

<h4>Set up your own authentication</h4>

<p>Authentication is a great thing. If you don't want us to do it for you, we recommend you do it yourself. This is the same approach we've always supported, and it will mean your domains are authenticated and no "on behalf of" text will appear in Outlook or "via" snippet will be shown in Gmail. The only drawback is that you'll need to have access to the domain's DNS settings to complete the process.</p>

<h4>Don't authenticate my emails (not recommended)</h4>

<p>If you don't have access to your DNS settings and you really don't like the "on behalf of" text in Outlook, you can disable authentication entirely. It's not something we recommend, but it's the easiest way to avoid any Outlook subscribers noticing a change. This is the default for how we've been sending email for you to date, so you won't see any negative impacts, you just won't experience the positive impacts of letting us sign for you.</p>

<h3>Update</h3>

<p>After further testing, we've confirmed that the "via" text in Gmail isn't impacted by letting us authenticate your email for you. Even if you turn authentication off, the "via" text will still appear for all your Gmail subscribers. This is exactly what they would have see before this update, so nothing is actually changing here for your Gmail subscribers.</p>

<p>The only way to avoid this "via" snippet altogether is to set up your own authentication by following our step-by-step guide to updating your DNS.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-06T18:29:03+00:00</dc:date>
    </item>

    <item>
      <title>Formatting plain&#45;text email campaigns &#45; is there a &#8216;right way&#8217;?</title>
      <link>/blog/post/3666/formatting-plain-text-email-campaigns/</link>
      <author>Ros Hodgekiss</author>
      <guid>/blog/post/3666/formatting-plain-text-email-campaigns/</guid>
      <description><![CDATA[
			
							<p>After a few of our customers wrote in recently asking for tips on formatting both text-only campaigns and the text versions of HTML campaigns, we figured it was high time to revisit an oldie, but a goodie - how to make the humble plain-text email look something flash. Given that the app automatically generates a text version whenever you create an HTML email campaign, you can be forgiven for never giving this a second thought. For the die-hards out there that continue to send plain-text emails, formatting can be do-or-die.</p>

<p>But first, a little background. For those who are wondering why text versions are still relevant to HTML email campaigns, it's because we send all HTML messages as <a href="http://en.wikipedia.org/wiki/MIME">multipart</a>. This means that if an email client doesn't know how to display an HTML message, it can conveniently fall back to displaying a provided text version of the campaign. Although most email clients can deal with HTML messages these days, there are those on older phones (notoriously the Blackberry), command-line clients and others on which image-free email is still alive and well. We'll be looking at how we can do our best to look after these subscribers. If you're sending plain-text only, this group is, well, everyone.</p>

<h3>Text wrapping vs. adding line breaks</h3>

<p><img src="http://i3.campaignmonitor.com/uploads/images/iphone-mail.jpg" alt="Text wrapping vs. line breaks on the iPhone" width="250" height="490" align="right" style="margin: 0 0 10px 10px; " /></p>

<p>When it comes to formatting plain-text emails, there are two camps - those who add a line break every 60-65 characters to their message, then those who don't. Both have pros and cons, depending on which email client your message is viewed in.</p>

<p>Personally, I find the 60-65 character limit works best in desktop and webmail clients. <a href="http://www.campaignmonitor.com/resources/entry/661/plain-text-templates-and-formatting-tips/">You can view a few examples here</a>. This is because there is effectively no limit to how wide paragraphs of text can run in most reading windows or preview panes. Paragraphs of text can become very much unreadable after 60 characters or so - traversing from the end of one long line to the beginning of another is just too much visual work for effective scanning.</p>

<p>This rule works well until emails that are formatted in this way are viewed on mobile devices. In iPhone Mail (see pictured), you can see how 65-character line breaks combined with wrapping text results in a very jagged message. It's arguably worse than reading an infinitely long line of text.</p>

<h3>What should we use?</h3>

<p>It's likely that if you're sending HTML email with a plain-text version containing line breaks, most mobile email clients won't ever have to fall back to viewing it. So it isn't quite time to undo the app's handiwork when it automatically creates a nicely formatted text-version of your HTML campaign. However, if you're sending plain-text campaigns only, then things are a little more complicated. Do you let email clients wrap your message text as they see fit? Or do you add your own line breaks for the benefit of desktop and web clients?</p>

<p>If you've sent a few HTML email campaigns in the past, it's worth having a look at your <a href="http://help.campaignmonitor.com/topic.aspx?t=201">email client usage reports</a> when deciding which way to go. If you're like us (with nearly 25% of our monthly newsletter subscribers reading it on iOS devices), then it may not be an appealing idea to add your own line breaks. Let your text run (and wrap) free! But in other instances, putting the time into formatting may be worth it. Unless sending HTML email takes your fancy instead, of course.</p>

<p><strong>Do you send plain-text email campaigns? Does formatting matter to you? Let us know in the comments below.</strong></p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-03-05T18:19:13+00:00</dc:date>
    </item>

    <item>
      <title>Today&#8217;s downtime explanation</title>
      <link>/blog/post/3669/todays-downtime-explanation/</link>
      <author>David Greiner</author>
      <guid>/blog/post/3669/todays-downtime-explanation/</guid>
      <description><![CDATA[
			
							<p>Today at 10am London time (2am in San Francisco and 9pm in Sydney) the Campaign Monitor network was unavailable to all customers for approximately 50 minutes. Everything is back up and running smoothly now, but we wanted to give everyone an honest explanation of exactly what happened and what we're doing about it.</p>

<h4>Here's what happened</h4>

<p>First of all, any downtime is inexcusable. We're incredibly sorry for delaying that important campaign of yours or temporarily breaking a link in an email you recently sent.</p>

<p>We have multiple load balancers sitting in front of infrastructure at both our data centres that acts like a cop, directing traffic to the right places internally. We renewed our license key with the vendor that supplies this special hardware recently, and it turns out they made a mistake and gave us a key that expired <em>much</em> earlier than they should have. Because the same key is used at both data centres, this effectively crippled our platform the moment they stopped working.</p>

<p>This means that your account itself was unavailable, along with our tracking system and API for that time period. Which is inexcusable.</p>

<h4>Here's what we did</h4>

<p>The moment the app went down our operations team were on to it and instantly contacted the vendor. While we would have liked things to move faster at their end, it took some 20 minutes to generate and provide the new keys. The moment we had them in our hands our records were updated and the app was instantly available again.</p>

<h4>Here's what we're going to do</h4>

<p>It's extremely frustrating that this problem was ultimately due to a trivial error by a vendor we rely on, but we're not going to pass the buck. This one is on us. Our next steps will be to audit all our licensing across all devices that pose this kind of risk in both data centres to ensure this can never happen again.</p>

<p>I also wanted to say a huge thanks for everyone's understanding during the 50 mins or so we were unavailable. While the team was working feverishly to get everything back to normal, I can tell you that it's a big help when you have people letting you know they understand and passing on best wishes. We owe it to you guys to never let a simple thing like this have such an impact again.</p>

						]]></description>
      <dc:subject>Latest News</dc:subject>
      <dc:date>2012-02-29T04:29:00+00:00</dc:date>
    </item>

    
    </channel>
</rss>
