Creating compelling call-to-action buttons
Buttons are one of the most effective ways to lead your reader to your page’s call-to-action. Here are seven ways to make your call-to-action buttons irresistible.
1. Size and white space
Small call-to-action buttons are easily missed when you’re scrolling through a web page. Buttons need to be big with lots of white space around them to really make them shine. For a main call-to-action, I’d aim for at least 230 pixels (px) wide by 50px high.
2. Contrasting colours
You might be tempted to use one of your brand colours or an understated colour for your call-to-action buttons. But your buttons need to be blatant, and should contrast with the rest of your site.
No single colour works best for everyone. Based on numerous studies, red buttons have been touted as more powerful than green, but it still needs to tie in with your website colours. It’s very simple to test, so experiment! See which gives you a higher conversion rate. Try reds, greens and the contrasting spectrum colours to your logo.
Adding a descriptive icon within the button can be effective in reinforcing your call-to-action. Icons such as a right arrow can signify ‘Next’, a down arrow, ‘Download’ and a magnifying glass, ‘Search’.
Generally, I’d pair the icon and compelling copy to reinforce the message, leaving nothing open to interpretation. A download icon on its own will not cause the same reaction to the same icon alongside the copy, ‘Download Now – FREE!’
"Pair the icon and compelling copy to reinforce the message, leaving nothing open to interpretation."
Want more articles like this? Check out the website design section.
4. Page positioning
Aim to place your most crucial button above the fold (i.e. high enough on the screen that the reader doesn’t need to scroll down before they see it).
Like text links, your call-to-action buttons shouldn’t be styled like anything else on the page. Again, they need to be dead obvious.
If you’re looking for a button in the true sense of the word, think about adding depth and texture to its design. You could also have the button look like it’s pressed when you hover the mouse over it.
You might find you need or want more than one button per page. That’s fine, but be sure to use a hierarchy so your reader can instantly identify which button is the most important. Remember, you don’t want to make them think.
7. Compelling call-to-action button copy
Ultimately, this is what will make or break your buttons. Everything else is an influence.
Think of the copy on your button as a command. ‘Try it FREE’, ‘Download your FREE copy’ and ‘Sign up NOW’ are just three examples of straight-forward commands that leave nothing to the imagination. This is what you need to aim for.
Like the colours, test to see which button is creating a higher conversion rate.
What changes have you made to your call-to-action buttons to create a higher conversion rate? What didn’t work?