Table of Contents[Hide][Show]
- 1. An Incentive / Freebie
- 2. The Right Colors
- The Color Green
- 3. White Space
- 4. Accurate Language on Your Button
- 5. First-Person
- 6. Microcopy
- 7. An Image (or Video)
- 8. An Attention Grabbing Headline
- 9. Action Words
- 10. Emotion Words
- 11. Personalization
- 12. A Benefit / Solution
- 13. A Sense of Urgency
- 14. A Photo of You
- 15. Sometimes You Need to Subtract, Not Add
- Launch (or Re-Launch) a Website Quickly
Calls to action! As website owners, we all know how important they are to our websites, email marketing, and other marketing campaigns, but writing and designing an effective call to action can be daunting and confusing.
This post will review some general call to action best practices, what to add or include in your call to action design improve click through rate, and some call to action examples and templates.
Call to Action Best Practices
Let’s start by going over some call to action best practices.
One Page, One CTA
For each web page, you should have one primary call to action. That is it.
People get overwhelmed or confused when asked to do too much, and overwhelmed, confused people don’t take action of any kind, even if it’s for something free.
Make it as simple as possible for someone to understand what the next step is and TAKE IT.
Define the purpose of your page first. When planning the content for any post or post, you should always do this anyway as part of your content strategy. Once you know the purpose of the page, this should help you define your call to action for that page.
If you struggle to narrow down your calls to action to just one, prioritize what you want people to do by asking:
- What is the number one thing I want my website visitors to do on this page? (Make this CTA the biggest and most obvious.)
- If they’re not ready to do that yet, what is the next best option? (Make this CTA a link in the page copy.)
Meet People Where They Are
Don’t overthink things. You do not need a unique CTA for every single page on your site.
You just need a CTA that supports your goal for that page and advances people to the next step in the conversion funnel.
Here’s a quick breakdown of how a conversion marketing funnel works (read more on our lead generation page):
All this means is that you need to choose the best call to action for where your visitors are in their journey.
If they are on a sales landing page for example, they are poised to buy something from you and just need a little more convincing.
If they are on a blog post, they are looking for more information on a topic. They are typically not yet ready to buy, but are ready to join an email list.
You Only Need Two CTAs for Your Whole Website (At Least to Start)
If you’re like most website owners, your website will have two main goals: one tied to making sales and one tied to building an email list to make sales later.
Start by figuring out the two main CTAs that you will use throughout your site—one for revenue pages and one for education pages.
- Revenue pages – One call to action to hire you or buy your product
- Education pages – A primary call to action to join your email list and secondary calls to action to visit your revenue-focused pages.
Now that you understand these basics, let’s jump into some design elements that make for an effective CTA.
Use These 15 Call to Action Design Elements to Boost Conversions
I want to note that call to action design is about more than visual aesthetics. It’s also about emotions, feelings, and copy. Everything should come together to form a cohesive and compelling design.
1. An Incentive / Freebie
Everyone loves a freebie, just make sure it’s helpful, actionable, and relates to a challenge that your audience has, or it won’t be much of an incentive.
Some examples of free incentives include:
- ebook or another download
- preliminary consult
- access to a membership area, gated content, or community
- white paper or case study
- risk-free trial
- coupon code
- bonus product or BOGO
- training session
- contest entry
- trade-in/trade-up program
- loyalty/rewards program
- email or video series
- exclusive sneak peak, webinar, or other invitation
When applicable, include an image of your incentive/freebie in your CTA design to make it more tangible, like in the example below.
2. The Right Colors
Different colors evoke different emotions. You can spend all day (and then some) researching color theory and color psychology if that’s what you’re into, but that’s not what I am suggesting here.
Simply take the basics of color psychology into account.
The Color Red
In a marketing context, red is typically used to indicate urgency. It also stands out more than any other color.
Red actually “[e]nhances human metabolism, increases respiration rate, and raises blood pressure.” No wonder it evokes a sense of danger and urgency!
Test out red on your sales landing page CTAs to see if this simple switch boosts your conversion rate. For businesses with multiple pricing options or tiers, use a pricing table with a red button/highlights to draw attention to the option you want people to choose, like in the below example.
The Color Green
Green on the other hand, “[s]lows human metabolism and produces a calming effect.”
Green may work better on static product pages or for other types of CTAs such as email sign ups or contact CTAs.
Use Brand Colors to Create a Cohesive CTA Design
Use your brand colors or complimentary colors when designing your CTAs. You want everything on your site to look cohesive. (Although, it’s okay to branch out and try a bolder color for testing’s sake.)
Use a contrasting color scheme in your CTA design. Typically a good combo is a neutral background color and a different high-contrast button color that captures attention and can’t be missed.
We talk more about color in web design in our post on How to Design a Blog.
3. White Space
White space is your friend! This is a tried and true design principle that never fails. A crammed CTA with too much going on hurts your user experience.
With the Gutenberg Block editor you can add padding to columns, groups, and cover blocks, or add spacer blocks so your CTA design is more user-friendly and engaging.
4. Accurate Language on Your Button
Your call to action button needs to accurately describe what will happen when someone clicks on it. Don’t leave any room for doubt or confusion. If it says “Buy Now”, then the person should be completing a purchase transaction.
Here are some examples and what should happen when clicked:
- Add to Cart – adds item to cart (could also redirect to the cart so they can see it was added
- Shop Now – redirects user to your ecommerce shop or landing page
- Download Guide – downloads guide or similar item
- Take Me to Checkout – redirects user to checkout page
- Learn More About X – redirects user to a page with more info or jumps to a section of the same page with more info
- Watch Demo – redirects user to a page with video or plays the video
- Start Trial – basically like a “buy” button, but should start the trial…this may also mean redirecting to a page (such as cart, checkout, or confirmation page) that visually shows what the person is getting and the start and/or end date of the trial
- Put Me on the List – adds user to an email list, wait list, or other list (also show and/or email a confirmation message)
- Send Me the Checklist – sends the user the checklist or similar item to their email
Did you notice that several of the examples in the above section user the first person? That’s on purpose.
Use first person pronouns like “I” and “me” in your CTA buttons/links to create a sense of inclusion. The first person POV makes people feel like the message is directed specifically at them, making them more engaged and willing to complete your desired action.
Microcopy is snippets of copy that guide, inform, or reassure the user. On CTAs, microcopy is usually located above or below a button or form, but it can be anywhere. Button text, form labels, placeholders, confirmations and other messages are all forms of microcopy.
Here’s are some examples of microcopy:
- We will never share or spam your email.
- No hidden costs or fees.
- No credit card required.
- You’re almost there!
- Thanks! We got your message and will reach out to you in 1-2 business days.
- Enter a detailed description of your issue here.
Microcopy can help increase user confidence, reduce friction, increase conversions, and even build your brand (by injecting some personality).
7. An Image (or Video)
Include a relevant image in your CTA to help bring your products to life and increase trust. Product images are great if you have them. Show context—the product in use—for an even bigger impact. For example, if you sell t-shirts, don’t just show the shirt, but an image of someone wearing it. If you sell paintings, show an image of a painting on a wall in a living room.
Stock images can also work if what you are selling is more abstract. In this case, choose an image that evokes positive emotions or depicts a person in the situation you’re describing. If the stock image can be edited and modified (based on its licensing agreement), then you can also create a branded version.
Below is a simple CTA with an image that you can easily customize with your own image.
You could even use a video in your CTA, like in the example below! Consumers are 85 percent more likely to buy a product after viewing a product video.
Another idea is to leverage photos/video of real customers. This includes:
- social media photos/videos of customers or brand ambassadors holding or using your products
- photo of customers accompanied by their testimonial
- video testimonials
Encourage your customers to submit photos and testimonials so you have more of these types of content to work with.
8. An Attention Grabbing Headline
The headline is one of the most important (if not the most important) parts of your CTA. Make sure it grabs the user’s attention.
No, that doesn’t mean SCREAMING IN ALL CAPS. While that probably would get someone’s attention, it’s also obnoxious and a one-way ticket to spam city or a page bounce.
A good call to action headline is concise. Good copywriting isn’t flowery, overblown language, it’s simple, direct, and clear.
It also speaks to the your audience’s needs or pain points. More on that below…
9. Action Words
Make your CTA copy actionable by using action phrases/words in your headline, body copy, and button text.
It should sound like you are instructing your visitors exactly what to do next.
If there is no action, then there’s no conversion. If it’s both actionable and shows the benefits of doing whatever you’re asking, this is the best of both worlds.
10. Emotion Words
Humans make decisions based on emotions, then use facts and logic to justify those decisions. Appeal to your audience’s emotions by emphasizing how they will feel after they buy, download, learn about, read, do, etc.
Positive emotions get people excited about taking action. Negative ones—leaning into your audience’s struggles—gets them motivated because they want to feel better or different.
I mentioned this toward the beginning of this post, but it bears repeating.
You may have the best written and designed CTA in the world, but if you are showing it to the wrong people, it makes no difference. Show the right CTA’s in the right places to increase their converting power.
Understand your target audience and their needs, wants, and problems. If they are browsing your products, you can hit them with the hard sell. If they are are reading a blog post, ask them if they want to join your email list for more tips on whatever topic they’re checking out.
12. A Benefit / Solution
What would your CTA be without mentioning the benefits or solution your offer holds? Tell people what they stand to gain, and be specific. How much time will your solution save them? How will their life change or look different? Address a particular sales objection and eliminate it.
13. A Sense of Urgency
Invoke FOMO! This may not always apply, however, if you are promoting a limited time offer of some kind, make sure to stress the urgency. (As mentioned earlier, color can also help with this.)
Tell people when the offer is valid until and to make sure they know act now or miss out.
14. A Photo of You
If you are asking someone to contact you, schedule an consultation, or anything else where a 1:1 interaction with you is involved, a visual of who they will be talking to goes a long way to making people feel more comfortable.
You can add other subtle icons under your image as well—to connect on LinkedIn or by email—as long as they don’t overpower your button, like in the below example.
15. Sometimes You Need to Subtract, Not Add
It’s not always about what you can add to your CTA, but sometimes what you can subtract. Be precise and get rid of the fluff.
Keep your colors, images, and other design elements simple. Everything should serve a purpose.
Sometimes a minimal CTA—like the below example—is best.
Here are some key action items from this post:
- Define the primary CTA for each page on your website.
- To start, create two CTAs that you’ll use throughout your site. One for revenue pages (buy now or hire you) and one for education pages (sign up for email list).
- Use a relevant incentive to draw people in.
- Use your brand colors (or complimentary colors) in your CTA design. Make sure your button contrasts and stands out.
- Make your CTA visually appealing with white space (group blocks/padding and spacer blocks).
- Describe exactly what to expect with accurate button text.
- Use first person pronouns to create a sense of inclusion.
- Use microcopy smartly to guide, inform, and reassure.
- Add an image or video to increase engagement.
- Grab attention with a concise, clear headline.
- Guide and put users in control with action words/phrases.
- Reinforce the perceived outcome with emotion words.
- Use personalization (i.e. show the right CTAs in the right places to increase conversion).
- Present the benefit/solution to make your offer appealing.
- Harness a sense of urgency for limited time offers/deals.
- Include a photo in contact CTAs to build trust and confidence.
- Subtract as needed. Every element in your CTA should serve a purpose.
Remember, your CTAs do not have to be perfect. The goal is to get something out there that is good enough, following the call to action design best practices and ideas outlined in this post.
I do recommend consistently revisiting your CTAs, checking their performance, tweaking, and testing (or a/b testing) as needed. This allows you to hone in on the finer details of the design and copy until you create the absolute best version of your CTA.