Grab a coffee and read our purpleblog

Tea works too. Or hot choco­late. Or even some­thing stronger! Our arti­cles are based on the most com­mon ques­tions we get from our clients, that’s why they are so inter­est­ing to read, and actu­al­ly utilise. You won’t notice how time flies!

6 min read Crafting ecommerce CTAs that convert

How to Craft E‑Commerce CTAs That Convert

Key Takeaways

  • CTAs that actually convert are aligned with customer interest and, therefore, will vary across webpages, emails, and social media. As your conversion goals will differ (e.g., a sale or a mailing list sign-up), so will the context, copy, and design of your CTA.
  • The words you choose, and the design of your CTAs will have a big impact on their efficacy – which you can also test with A/B testing.
  • There needs to be trust for customers to convert. That means not overloading them with tens of CTAs and pop-ups. Keep things bold and simple.

Mar­ket­ing efforts are suc­cess­ful if they bring true val­ue to a busi­ness. Mar­ket­ing cam­paigns should attract, keep and con­vert vis­i­tors into customers.

Your busi­ness web­site is the best place to focus on when it comes to increas­ing web­site traf­fic and mak­ing online sales.

Stim­u­late your tar­get audi­ence to fol­low the buy­er’s jour­ney and reach the end — pur­chas­ing a ser­vice or a product.

There are dif­fer­ent strate­gies that can help you improve your web­site con­ver­sion rate. One of those strate­gies is to incor­po­rate call-to-action buttons.

In order for them to work right, they need to be done right.

What is a CTA?

CTAs (calls-to-action) are but­tons used through­out a web­site to nav­i­gate vis­i­tors to the actions they need to take, where to click, what to read or what to buy.

A CTA is a com­bi­na­tion of words and adver­tis­ing mes­sages that encour­age sales.

A CTA mes­sage must be clear and straight-for­ward. Peo­ple need to know what will hap­pen after they click it before doing so.

Check out this exam­ple from the Ergo­Er­go web­site.

What do you think would hap­pen if you click the “BUY NOW” button?

You’ll prob­a­bly be direct­ed to a prod­uct page, where you can pur­chase the prod­uct, or a list of retail stores that are offer­ing that product.

In any case, it will take a cus­tomer to the next step in the sales funnel.

Plac­ing the right CTAs in the right places can keep your cus­tomers engaged with­out jeop­ar­dis­ing the rela­tion­ship you’re build­ing with them.

There is no right way to make your CTAs more effec­tive. You need to spend time test­ing phras­es, colours, and place­ment to see what res­onates best with your audience.

Here are some best prac­tices you can incor­po­rate on your web­site that are proven to have a pos­i­tive effect on the con­ver­sion rate of a website.

Consider the CTA intent

The actions your CTA entices your cus­tomers to make should be aligned with their interests.

For exam­ple, some­one on a prod­uct page is inter­est­ed in buy­ing, some­one on a blog page might be inter­est­ed in sign­ing up for a newslet­ter, some­one research­ing your ser­vices might be inter­est­ed in learn­ing more about what you’re offering.

Use CTAs that entice them to learn more about your services.

Here is an exam­ple from our own website.

Some­one on a con­tact page is inter­est­ed in mak­ing con­tact with your busi­ness. Add a way to call or send a message.

The CTAs must help them achieve their goal, rather than mov­ing them away from that goal.

Peo­ple are often hes­i­tant to click but­tons on web­sites, so you need to make sure you con­nect the action with the cus­tomer’s intent.

All this requires you to know who your audi­ence is, what their prob­lems and desires are, and how they got to your page.

For exam­ple, if you place a “BUY NOW” but­ton on edu­ca­tion­al con­tent such as a blog post, you can be sure that nobody will click on it. That type of CTA will work bet­ter on a ser­vice or prod­uct page.

Work on the CTA copy

Words you use in CTAs are important.

There are cer­tain action words that are proven to improve conversions.

Some of these words are “Buy”, “Down­load”, “Get”, “Join”, “Start”, “Explore”

The copy of the whole land­ing page is impor­tant when it comes to con­ver­sions. No mat­ter how well you craft your CTAs, they won’t work if peo­ple do not have all the infor­ma­tion to make an informed deci­sion. You want the web con­tent to sell your CTA.

Keep things sim­ple and scannable.

Make the CTA per­son­al to your audi­ence. The more per­son­al you can make it, the bet­ter your con­ver­sions will be.

On the pur­ple­plan­et home­page, we use “Choose your goal” instead of “Ser­vices”.

This way we not only use an active verb and entice the peo­ple to take action but we also con­nect it with the main rea­son they land­ed on our web­site — to improve their web­site presence.

Keep the copy short and sweet.

Sus­pend­ed Cof­fees uses short but­tons such as “Find a Café” to dri­ve cus­tomers to a list­ing page where they can explore dif­fer­ent cof­fee shops.

Set clear expec­ta­tions of what you want your clients to do, and what you will deliv­er when they com­plete the actions, to improve your chances of conversion.

If your goal is to get vis­i­tors to learn more about the ser­vices you offer, place a but­ton that says “Browse our ser­vices” instead of a sim­ple “Learn more”, sim­i­lar to what Fel­low Health Part­ners are doing.

CTA Design and colour

When it comes to CTAs, design is crucial.

CTAs need to be con­sis­tent with the over­all look of the web­site, but they also need to stand out.

  • Use con­sis­tent CTAs through­out the whole website

You can­not use a big bright red but­ton in the nav­i­ga­tion and then use a blue or green one fur­ther down the page. This will con­fuse your vis­i­tors. You should fol­low brand guide­lines regard­ing colours, shapes, and forms.

Incor­po­rate con­trast­ing colours in the but­tons and make them look click­able, like Fel­low Health Part­ners do.

  • Use big, bold CTAs

Use big­ger CTAs to attract vis­i­tors’ atten­tion. Big­ger but­tons are hard to ignore.

Look at this CTA from Com­mon Sense Advi­sors, for example.

Big CTAs are also mobile-friend­ly, as they are eas­i­er to click.

It’s hard to miss the Com­mon Sense Advi­sors but­ton, even on mobile.

If you don’t want to use big CTAs you can still make peo­ple pay atten­tion to them by dis­tin­guish­ing them by using dif­fer­ent colours or by using a lot of white space around the but­ton to make it stand out.

Just like Health­a­lyt­i­ca are doing.

  • Use loud colours

Peo­ple often scan the con­tent on a page instead of read­ing it, so if the page has a lot of text, make the but­tons stand out by using bold text, high­light­ing the text or with a bold back­ground colour.

You can also accom­pa­ny the but­ton with attrac­tive illus­tra­tions that excite the user, to dri­ve more clicks.

See how we’re doing that when pre­sent­ing our services.

Place the CTAs strategically throughout the page

Grab your vis­i­tors’ atten­tion the sec­ond they land on your web­site. It’s a good prac­tice to place your main CTA above the fold on your website.

“Above the fold” is the first sec­tion a vis­i­tor sees on a web­site with­out hav­ing to scroll down the page.

To fig­ure out where to place the rest of the but­tons, think about the sales fun­nel. For exam­ple, a great place­ment for a “Buy Now” but­ton is after a sec­tion where you explain the prod­uct benefits.

Include a secondary CTA

Using a sec­ondary CTA is a great strat­e­gy for a web­site that has a lot of infor­ma­tion to explore or ser­vices to browse.

Keep the empha­sis on your main CTA.

There’s a main CTA “Choose your goal” and a mut­ed CTA “Get a free consultation”

Both are click­able and action­able but we want to high­light one over the other.

The sec­ond CTA is with­out a colour­ful back­ground, to make the main one stand out more.

The but­tons also tar­get peo­ple from dif­fer­ent stages of the fun­nel. The first but­ton is for peo­ple who are already con­vinced what types of ser­vices they need and want to explore more. The sec­ond “mut­ed” one is for peo­ple who know they need to improve their web­site pres­ence but are still unsure of how they can do that. Hence, we pro­vide a free con­sul­ta­tion to help them fig­ure it out.

Incor­po­rat­ing mut­ed CTAs is a smart strat­e­gy when tar­get­ing dif­fer­ent con­ver­sion points.

Be care­ful when incor­po­rat­ing a sec­ond but­ton, you want to make sure that one of them is tru­ly mut­ed, as you don’t want them to com­pete for the user’s attention.

CTAs can make or break your con­ver­sion rate.

You need to spend time craft­ing CTAs that will res­onate with your audi­ence. If you need help cre­at­ing and apply­ing the right CTAs on your web­site, feel free to con­tact us.


Free Consultation
Please let us know your project requirements, and we’ll get in touch as soon as we can.

    We are pleased to welcome you on the purpleplanet!
    To order the service package you’ve chosen, please fill in the form and we’ll get in touch with you soon.

      We are pleased to welcome you on the purpleplanet!
      To order the service package you’ve chosen, please fill in the form and we’ll get in touch with you soon.