A call-to-action button is the icing on the cake that is your landing page or website.
A well-designed CTA button is attractive and succinct, persuasive and eye-grabbing. If you aren’t getting clicks on your CTA button, you’re losing all the engagement that you worked so hard to get. If it looks like your conversions are on the decline, it might be time to consider giving your call-to-action button a makeover.
First and foremost, your CTA button should look clickable, and visitors should be able to identify it as a button immediately. No one will click your CTA if they don’t know there’s a button to click. There are a few ways to accomplish this, such as adding a drop shadow or 3D effect or coding it to change color or animate when a visitor hovers over it with the mouse.
Make it stand out
Your CTA button should stand out from its surroundings. It needs a healthy amount of white space around it so it isn’t lost in the content of your page. It should be large and bold, while still consistent with your branding so it can’t be mistaken for an unrelated ad. A solid border around your CTA button will help its shape be more visible at a quick glance.
At this point in the digital marketing game, people are accustomed to seeing CTA buttons that are rectangular. There’s no reason to try something new here, as it will no longer be easily identifiable as a button. A rectangular button can have sharp or rounded corners, but try not to overcomplicate the shape.
Positioning your button
Deciding on where to place your button on your website or landing page depends on the layout. For some, placing the CTA button at the top of the page proves effective. For others, placing it at the bottom after all the rest of your content makes more sense. You can experiment with this and look at which position gets the best results.
According to a study done by Nielson Norman Group, people’s eyes move in a pattern that looks like the letter F when they are scanning websites. They read horizontally on the top part of the content, then move to the left side and scan down the page a bit before reading horizontally again, then they look back to the left side and scan vertically. Take advantage of this predictable behavior by placing your CTA button somewhere in that F-shape.
The color you choose for your CTA button will affect visibility. You can do everything else right, but if your button is the wrong color, it can easily be overlooked. Choosing a color that contrasts with the design of your page will help it stand out better. Certain colors carry a different meaning, as well. For example, a red button might make people think there is a sense of urgency or seriousness to your call to action. A green button conveys action, like a traffic light or power button. If you’ve included a solid border in your design, make sure the color of that border compliments the color of the button.
Lastly, the copy you choose for your button will seal the deal. Your CTA button could be award-winning from a design perspective, but if the messaging of your copy is not persuasive or engaging, who cares? After all, this is the “call to action” part of a CTA button. Keeping your copy short and sweet is the best strategy. Your viewer will have already done enough reading and should be ready to act if your website and landing page are convincing enough. It’s the CTA button’s job to encourage them to act on that messaging without a second thought. A good rule of thumb is that your CTA button copy should not exceed 60 characters, and should not contain words that are syllable-heavy.
Our website contains some great examples of CTA buttons done right. While our CTA button strategy works for us, your needs may be different. We can work with you to identify areas of opportunity on your website and landing page to encourage visitors to click your CTA buttons.