Call-to-Action Buttons Best Practices – 5 Tips To Follow
August 18, 2013
In a previous blog post, we talked about 5 elements to include in your design to make it highly convertible. One of those elements was an easily seen, clearly expressed call-to-action. In this post, we’re going to expand on this element and give you some tips for designing an effective call-to-action button.
Call-to-Action Button Design Best Practices
When designing your call-to-action button, there are three things to consider: appearance, copy, and location.
Appearance – What does the button look like? Does it stand out? Is it big enough? Is the design professional and welcoming? It’s important to have a nicely designed button that is a unique color from the rest of the page design so it stands out. It is also important to make sure the button is large enough to be noticed and is immediately acknowledged as the dominate button on the page.
Copy – What does your button say? We’ve found that being short and direct is most effective. The button should say exactly what the prospect will get when the button is clicked. Keep it simple and make sure the copy is large and easy to read. If you need additional explanation, do not jam it into the button copy, but rather add some additional call-to-action copy on the landing page with a directional cue (arrow) to the simple CTA button.
Location – Make sure the your CTA button is in the most optimal location. Depending on the content of the landing page, the button might be better on top of the design, or in some cases it might be better further down the page, after the sales message has been effectively delivered. Most of the time, however, it’s best to have the CTA button above the fold on both desktop and mobile devices so the prospect does not need to scroll down to convert. A/B testing for the best location of your CTA button is recommended.
5 Best Call-to-Action Button Design Tips to Follow
Here are some easy tips to follow when evaluating your CTA button:
If you zoom out to 30% can you still easily see your CTA button? If not, it’s not big enough. You can also try backing up about 8 feet from your screen instead of zooming out.
Is the color of your CTA button different from the rest of your design, for the most part, and does it clearly stand out?
Have 3 random people look at your design for 5 seconds. Then, close the design and ask them if they can tell you what your call-to-action is. If they can’t, it’s not clear enough.
Review your competitors’ landing pages and audit their calls-to-action. Is your call-to-action easier to see and more compelling? If not, you have some work to do.
If you’re not sure you’re using the best CTA, try A/B testing a few different button designs, locations and copy. Then, let the data tell you what is best.
Call-to-Action Button Design Examples
Here are some recent great call-to-action button designs we’ve created for some of our clients. All these designs are already zoomed out, and you can see the CTA buttons are still easy to see.
For a free design consultation give us a call. We’d love to help you come up with the most convertible call-to-action design.