A call to action (CTA) or CTA button in ecommerce should make it clear to online users what the next step in their journey will be. This could be to add an item to their online shopping cart, sign up to a subscription or perhaps complete the purchase.
A CTA or call to action is a core element on a webpage that acts as a stepping stone to what the user should do next. For example, think of a CTA as a signpost, without clear direction the user may not understand where to go next to complete their purchase or sign up to a newsletter. A strong ecommerce CTA can help to increase conversions, by offering clear signposts to users.
It’s important to remove any friction from the user journey to push them further down the sales funnel. Of course there can be multiple calls to action on each webpage with different wording, sizing, colour and links. There’s no perfect formula for a CTA. What works for one site may not on another, but whatever the size, shape, wording or color, it needs to be noticeable on the page.
The risks of not adding a CTA on a blog post for example is the user may leave the site without completing a task. This means your bounce rate and page exit rate may increase. It’s a good idea to try and get your users to go deeper into your site and browse more pages.
Here, we’ll look at some things to think about when designing or tweaking CTAs.
CTA Meaning: What Is A Call To Action?
A call to action (CTA) is a marketing prompt on a website that tells a user to take a specific action. A CTA can have a direct link to a sales component or it can simply move the user further along the desired customer journey to becoming a customer of the company. A CTA is usually written as an action or command such as ‘Sign Up’ or ‘Get A Demo’ and is in a button and hyperlink format.
Website Call To Action (CTA) Examples
A website CTA can include any task that you want the user to take. A call to action can be placed anywhere on a webpage and can lead the user to a specific area of the website. For example, each CTA can be a button on a blog post like a demo or newsletter, a hyperlink in an email or a social media icon.
Below are some website call to action (CTA) examples on a blog:
- Sign up to a newsletter
- Download an ebook
- Get a demo
- Share on social media
- Read more articles
Below are some website call to action (CTA) examples for B2B:
- Get a demo
- Book a meeting
- Contact sales
- Free trial
- Sign up
Below are some website call to action (CTA) examples for ecommerce:
- Add to cart
- Buy now
- Add to wishlist
- Shop the sales
- View more styles
How To Use A/B Testing For CTAs
A/B testing your calls to action (CTA) strategy helps you make the most effective conversion rate optimisation choices. For example, each user or customer base responds to various CTA best practices differently. Sometimes you can be surprised at your A/B test results but the key is to create the right tests.
Some points to consider while testing include isolating your tests to one variable. Keep it simple and this will enable you to read the results better. You should also test the same sized segments because each customer segment can behave differently. And finally, make sure to create more than one test to get a holistic view of the test.
Ecommerce CTA: 6 Best Practices
When you are planning your call to actions (CTA) there are a range of different best practices you should think about. Below we highlight 6 of the most important. There is also an opportunity to A/B test your CTAs to make sure you have the most effective strategy.
Calls to action shouldn’t be too subtle, so make them big enough to catch the attention of your shoppers. It makes sense for them to be the largest button on the page, to help it stand out from the background and underline its importance.
The CTA size will also depend on the device, such as desktop or mobile. There is also a size difference between webpage CTAs and email CTAs. For example research by Apple say ‘CTAs in mobile UI should be at least 44×44 pixels, and Microsoft recommends 34×26 pixels’
The choice of color used on a CTA can help to make it stand out on a page. There’s a lot of talk about color psychology and how the choice of color can affect whether someone clicks. Certain colours are said to have different connotations and can increase or deter clicks.
However a main CTA color best practice is to make sure the button and background colors are contrasting so the call to action stands out from other elements on the webpage. You can increase your conversion rate with a high button color and background color contrast.
The more likely effect of colour choice is in how it matches brand design, and how the contrast between CTA and background helps to catch the customer’s eye.
In this example from Polar, the contrast of the red CTA against a white background makes it unmissable.
Here, Hertz changes CTA colours to ensure contrast with the background, ensuring that the calls remain visible.
Wording of CTAs
This is about clarity. People scan pages and absorb information quickly so the purpose of the CTA needs to be conveyed in just a few words, the less the better. This is why CTA microcopy is essential and should be snackable and scannable yet still catch the attention of your users.
In the Greenpeace example above, ‘act now’ works as it matches the topic and gives the CTA added urgency.
In other cases, it helps to use wording that describes what the CTA does, such as ‘proceed to checkout’, ‘book now’ or ‘add to bag’.
Exactly where you choose to place a CTA can affect how noticeable it is.
Many ecommerce sites now use multiple CTAs to ensure that shoppers can see them no matter where they are on the product page.
This can help when some ecommerce product pages are long and detailed. Some Amazon pages contain 10 or more calls to action, some repeating the original CTA, others for product bundles or cross selling options on the page.
Another option is to have a sticky CTA which shoppers can view as they scroll further down the page.
AO.com has one, so shoppers can choose to add items to their basket when they’re ready, perhaps after checking out reviews from other customers.
Use Large Mobile CTAs
For mobile sites or apps, CTAs need to pass the ‘thumb test. That is, they need to be easy to tap without the user making an error.
It helps to make them large enough to be unmissable, as well as ensuring they’re far enough away from other links.
Show Key Messages Around CTAs
The CTA is designed to capture the shopper’s attention, and so this makes it a useful place to add key messaging.
This could include:
- Size guides.
- Delivery and returns information.
- Stock indicators and other product trends info.
- Alternative payment options, such as instalments.
- Urgency information. Countdown timers can be used to highlight nest day delivery windows, sales end dates etc.
The main job of the CTA is to ensure that, when visitors are ready to make a booking, a purchase, or some other conversion, it makes the next step obvious.
Effective CTA design is about finding (and testing) the right combination of size, colour, placement and wording which ensures that shoppers have no difficulty in finding them.
The 2021 Ecommerce Stats & Trends Report
The latest data on ecommerce trends and online customer behaviour
Graham Charlton is Editor in Chief at SaleCycle. He's been covering ecommerce and digital marketing for more than a decade, having previously written reports and articles for Econsultancy. ClickZ, Search Engine Watch and more.