Click, Tap, and Touch: A Guide to CTA Best Practices
Every email has a purpose. Whether it’s to inform users of a product update, an upcoming event, or the latest offers, every campaign should exist for a reason and have a goal. In most cases, that goal is to get subscribers to do something.
The copy and design of your campaign can go a long way towards getting users to interact with your email, but the most important part of eliciting interaction is the call-to-action, or CTA.
WHY IS A CTA IMPORTANT?
While some email campaigns exist purely for entertainment or educational reasons, most campaigns are used to market something — a product, service, or event. Email marketers need their subscribers to buy those products, subscribe to those services, and register for those events. The only way to accomplish that is by getting subscribers out of their inbox and onto a landing page.
It’s not enough to send great content and hope that a subscriber remembers you or your website (although that helps). You need subscribers to take action immediately, and CTAs are the way to do that.
You can’t just slap a button anywhere in your email and expect superb conversions, though. There are a number of guidelines to keep in mind when designing and implementing calls-to-action.
DESIGNING CALLS-TO-ACTION
PURPOSE
Just like an email needs a purpose, so does a call-to-action. Sure, the purpose is to get subscribers where you want. But, by asking yourself the following three questions, you can get beyond the superficial and figure out the real purpose behind your calls-to-action:
- What do I want a subscriber to do?
- How will they know what to do?
- Why should they do it?
Every call-to-action should provide some value for the reader.
Whether or not it is explicitly stated, it should be clear to the subscriber exactly what they get for investing their time in your email and landing page. These questions help to clarify that value and, once answered, you can start thinking about how best to convey that value proposition in a call-to-action.
LANGUAGE
There are two parts to any CTA: the language and the design. While the design helps draw the reader’s eye to the CTA and makes it easy to use, the language in the call-to-action is what convinces a reader to interact with it.
The biggest mistake that marketers make is using weak, passive language in their CTA. A classic example is the infamous “click here”. While “click here” may seem like a great CTA (in that it tells a subscriber exactly what to do), it really doesn’t give a reader any incentive for taking action. It doesn’t describe the value or what will happen if, in fact, they do click the link.
Instead, you should use language that describes why a user should follow a link. Use verbs to describe what they will do by interacting with the CTA and, if possible, create a sense of urgency or timeliness.
Here are some examples of more descriptive, enticing calls-to-action:
- Shop Fall collection now
- Access your account
- Get 50% off today
- Start testing
- Learn more
Some CTAs, like “buy now” infer a greater commitment on behalf of the subscriber — you’re asking them to spend their money by clicking the button. On the contrary, “shop now” represents a much lower commitment. A while back, we ran some tests to see if high or low commitment language works best. We found that typically, low commitment propositions work better for calls-to-action.
High commitment propositions, like alluding to spending time or money, can be scary for a medium as casual as email. Instead, focus on low commitment propositions that don’t require a huge investment in money or time from your subscribers.
A call to “learn more” doesn’t force a reader to think about spending money. Instead, they think about what exactly they can learn and how that can benefit them. Add value through email, and leave the sales pitches for the landing page.
SIZE & PLACEMENT
After you have nailed down the language for your call-to-action, it’s time to think about its size and placement.
As mobile takes over as the most popular method for consuming email, the physical size of CTAs are more important than ever. While clicking a link with your mouse on a desktop provides very precise control, touching a CTA with your thumb can become frustrating when targets are too small or cramped too close together on mobile devices.
Generally, you’ll want to keep calls-to-action big enough for even large thumbs to easily tap. Apple suggests making touch targets at least 44 pixels square. We recommend that as a great starting point when designing any CTA.
Along with making CTAs big enough, you need to provide generous spacing around them. While links within body copy don’t allow for spacing around them, most buttons and images do. Including whitespace around CTAs prevents users from getting frustrated when they attempt to tap one link and get another.
You want your main CTA to be seen quickly, too. Placing your most important CTA early in the email is a good way to ensure this. While some might argue that the fold doesn’t exist on mobile, keeping your main CTA towards the top of your campaign accounts for readers that are not likely to scroll.
It can also help to repeat your main call-to-action further down in the email. Enthusiastic scrollers may miss the first one and the repetition helps to add weight to your CTA and reinforce its importance.
CONTRAST
Finally, when designing any CTA, it’s important to think about how it will contrast with surrounding content.
Using color is a great way to add contrast. Vibrant colors are generally best at drawing the eye to the CTA. Even if you use muted colors for your calls-to-action, they need to contrast with any background colors, images beneath the CTA, or surrounding text.
Take these two examples:
Which one draws your attention?
CTA TYPES
While most people typically think of buttons when they think call-to-action, images and text links are just as likely to show up in an email and should be given equal attention.
IMAGES
Images are a great way to add visual appeal to campaigns. The same guidelines above apply to any calls-to-action in an image. You should strive for persuasive, actionable, and timely language coupled with enough contrast, size, and spacing to make them both noticeable and easy to interact with.
The main problem with using an image as your main call-to-action is that many email clients block images automatically, in turn blocking your CTA, making it unreadable.
If you have to use an image for your CTA, use ALT text to improve the experience for users reading in a blocking email client.
<img alt="eat your own dog food" src="path/to/image" width="550" height="480" style="display: block; font-family: Arial; color: #ffffff; font-size: 18px;" border="0">
A lot of email marketers use images for buttons, which still suffer from the images off problem. A better solution is to use bulletproof buttons when coding your calls-to-action.
Even if you don’t have an image-based CTA in your email, you should still link most images out to a landing page. Users are used to having images in the header and footer link to things like home pages. Breaking this expectation is a recipe for user frustration.
BUTTONS
Bulletproof buttons, which consist of live text styled to look like image-based buttons, have been in use by email designers for years. It wasn’t until Campaign Monitor developer Stig Morten Myre refined the technique that it became popular, though. Using HTML and inline CSS, along with Microsoft’s proprietary VML code, he pioneered a way for email designers to craft beautiful buttons that rendered well across clients even with images disabled.
Bulletproof buttons are the best way for designers to use button calls-to-action in their emails.
Not everyone is able or willing to slog through VML code, though. Fortunately, Campaign Monitor has a free bulletproof button tool that makes generating beautiful buttons a breeze.
At Litmus, we use a simpler bulletproof button that relies only on HTML and inline styles for rendering. Even without the VML fallback, it holds up well across most email clients.
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" style="padding: 25px 0 0 0;" class="padding2" colspan="2">
<table border="0" cellspacing="0" cellpadding="0" class="responsive-table">
<tr>
<td bgcolor="#d75742" style="padding: 12px 18px 12px 18px; -webkit-border-radius:3px; border-radius:3px" align="center"><a href="url" target="_blank" style="font-size: 16px; font-family: Helvetica, Arial, sans-serif; font-weight: normal; color: #ffffff; text-decoration: none;">Learn More →</a></td>
</tr>
</table>
</td>
</tr>
</table>
Using CSS3 styles, you can get away with things like rounded corners and shadows in clients that support them. To take your buttons to the next level, you can even incorporate CSS hover effects — adding interactivity that is unmatched by image-based buttons.
TEXT LINKS
Both images and bulletproof buttons get most of the love in email. Their visual nature appeals to designers and subscribers alike. However, text links are just as important in any campaign.
Designers typically don’t have the same level of control over text links as they do with images and buttons. It’s awkward to adjust the size of a link within a block of copy. We also can’t really increase the space surrounding most text links without sacrificing the design of the message. Therefore, color and font-weight are the most important tools when dealing with text links.
Compare these two blocks of copy:
Using only simple inline CSS, we are able to increase the visibility of the link and the likelihood of it being followed.
<a href="..." style="color:#ff8f1c; font-weight:bold; text-decorations:none;">now available</a>In areas that are typically link-heavy (think navigation, footers, preference sections), you can use padding around the links to ensure that these “link clusters” are useable both on desktop and mobile devices.
HOW MANY ARE TOO MANY?
A strong point of contention between designers is just how many calls-to-action should be included in an email. Retailers generally include dozens of CTAs, the theory being that at least one of them will be of interest to a subscriber. However, many marketers like to focus on one or two CTAs in an attempt to make them more significant for subscribers.
So which strategy works best?
We say this a lot when talking about email but — it depends. Including a ton of links can appeal to a wide variety of subscribers but can dilute your message. One CTA can hone your message, but may exclude a large number of subscribers that aren’t interested in that particular message.
You need to find a balance and strategy that works for your audience, not someone else’s. One of the best ways to do that is through testing your campaign.
TESTING YOUR CTA
There are a number of useful things to test to increase the effectiveness of CTAs. As mentioned before, you will want to test the number of CTAs to hit on what works for your audience.
Another idea is to test the language, color, design, and type of link. You may think that a bunch of huge, colorful buttons would work for your campaigns but you may find that your readers prefer a few simple text links instead.
Always test and reflect on your campaigns to find what works best.
FOLLOW-THROUGH
As email marketers, we sometimes get lost in implementing a design and lose sight of the entire lifecycle of a subscriber, especially outside of the inbox.
The subscriber journey doesn’t begin and end with your email, it’s just one step of many.
Once you get a subscriber to interact with your email, you need to make sure you follow through with the promise of your CTA by providing value with your landing page.
Don’t make subscribers dig through page after page to get to the content promised in the email. On the same note, don’t make mobile users fight a landing page designed solely for desktop users. As more and more people read email exclusively on mobile, the need for a mobile-friendly landing page grows.
Do everything you can to make the subscriber journey a pleasant one. Keep your CTA descriptive, timely, easy to find, and easy to interact with. Above all, promise your subscribers real value and keep that promise even after they leave their inbox. If you follow these guidelines, not only will your subscribers thank you, but the return on your email campaigns will likely increase as well.
Want more great tips for your next email marketing campaign? Subscribe to Litmus Weekly, a weekly digest of the latest and greatest from #emailgeeks around the world.
This post originally appeared on the Litmus Blog.
