The internet is filled with CTA (call to action) buttons. Everywhere you go there are brightly colored commands to “read more,” “get the content,” “watch this,” “buy now,” “listen now,” and so many other options. All those buttons exist because they work. People respond, click or take action when commanded to do so. But some CTA buttons work better than others.
Before you design your next call to action button: READ THIS
Keep it Short
Ideally, your button text should be 1-3 words. A reader can comprehend the command at a glance. And the short bold statement leaves little room for doubt regarding the appropriate action or next step.
An effective button depends on the words or phrase you choose. Research has shown the more specific the button text, the higher the conversion rates. Good options for button text include:
Action phrases: Examples include Click, Register, Go. The button tells you exactly what action you are supposed to take
Benefit phrases: Examples include: Get the Kit, Grab the Resource, Watch the Video – Here the CTA focuses on the benefit. The viewer takes action because the little voice in their head is saying, “Yes, I want that!”
Avoidance phrases: Examples include: Don’t Miss This, Last Chance. Although not as obvious to a user, this style button taps into a viewer’s fear of negative consequences. It will work if your offer is tied in some way to something very desirable. It won’t work if you have a relatively low-interest offering.
Don’t SUBMIT. The most common default language for a button is the word “Submit.” Unfortunately, it is also one of the least effective. If you are looking for more choices, check out this list of 25 proven CTA’s by Wishpond.
Shout A Little
When you are in a crowded room and you want to get someone’s attention, sometimes you have to shout to get noticed. Or at least raise your voice. Online you need to do that visually.
Use ALL CAPS. While this may be hard to read in long blocks of text, or considered a little rude in an email it is critical in your CTA button. The all-caps font stops the reader and makes them pay attention.
Keep fonts simple and bold: This is not a time to go for the thin, willowy look or decorative calligraphy. Choose, strong easy to read sans serif fonts that convey a message at a glance.
Make a Statement with Color
There is a significant amount of debate regarding color choices for your CTA buttons. Some experts advocate for red, while others argue that red is the color of a stop sign. Some suggest bright neon and others suggest blue because of its universal appeal. There are some hardliners who believe there is only one right color and then there are others who think it depends on the industry or the gender and age of the person you are trying to attract.
We have found that the best choices rely on contrast. If most of your page titles and backgrounds are dark blue, don’t make the button blue. Use one of the other colors in your brand family. The contrast will make the button more prominent and eye-catching on the page. Make sure your font color also contrasts well with the color of the CTA buttons. Remember, this is no time to be subtle.
Make CTA Buttons Dominant
Yes, the image surrounding the button is important, the text and form also add value, but the button is the payoff. This is where the action happens, so give it some space. Our rule of thumb is to make your button about 1/3 the width of your form. This gives the bottom of your form a nice visual balance and follows the rule of thirds for composition. If you’ve built your form to be short and narrow, then you can break this rule and use a wide button that matches the width of your fields.
If you are adding the button to a footer graphic or social share image, that 1/3 still works well. One notable exception, Facebook has a 20% rule for text on social share images. If you are planning on boosting the post or using the image as part of an ad you will need to make the button slightly smaller.
Test, Test, and Test again
This post contains some general rules about what works best in most cases. And if you are interested, you can download our button toolkit to try some of these ideas on your own but don’t stop there. CTA button design is both an art and a science, so be a good scientist and test your ideas. Conduct some AB research with two identical pages with different buttons to see if one delivers higher results. Just be patient and let the test run long enough to collect a few hundred downloads before you pick a winner.
Ready to get started? Then GRAB THE KIT