I’m going to be up-front with you right now; if you’re looking for a specific answer to the title of this blog post, you’re going to be disappointed. There’s no such thing as a perfect CTA, for any of those factors. I can’t tell you a specific color that works, a specific size, a specific position, or specific text. I can give you general guidelines, and I can give you ideas for testing to make your call to action more effective, but I can’t give you a perfect recipe for success.
The reason is simply the way the web works. Every site has its own design, and thus the elements that blend in and the elements that stand out will be different from site to site. Facebook won’t use a blue CTA if they wanted to stand out against their blue site design, but a red CTA would be near invisible on Pinterest. On top of that, people get used to common techniques and start ignoring them. Banner blindness is a real thing.
So, let’s break down your call to action into four segments. You have the size of the button itself, the color of the button, the text on the button, and the position of the button on the page.
The typical CTA button is a relatively small rectangle, generally with rounded corners, made to look like a soft button in the Web 2.0 style. Drop shadows, highlights, and other such elements are common. However, the size and shape of your button is not limited to the rectangle. Rectangles are simply easiest to make without using an image, and are the easiest to work into the design of a site without designing around the button.
The easiest tip I can give you is to assign a value to the action your CTA represents. The higher the value of the action, the larger the button should be. However, this should be tempered by the cost of taking the action. For example:
As for testing, all you can really do here is increase and decrease the size of the button until you find the sweet spot. Most of the time you won’t have to redesign your page, just shift a few elements around for the largest or smallest button designs, and that’s it. Once you figure out the sweet spot, you can run with it for all CTAs of that level of cost and value, testing occasionally to make sure it still works.
Color can be as complex or as simple as you want it to be.
On the simple end of the spectrum, all you need is something that stands out. I used the Facebook and Pinterest example above, but it works for any site. If your logo, your design, and your graphical elements are all orange, a decent green will stand out enough to make your CTA look exceptional. If your site elements are all blue, an orange or red CTA will stand out.
The point is to find a color that draws in attention. If you ignore images that change from blog post to blog post, you’re left with elements of color in your logo, navigation, dividers, social sharing buttons, and links. This can be quite a bit of color, but it’s generally focused in a spectrum. You’ll have blues and grays, or reds and oranges, or greens. Picking a color that stands out while not clashing draws the eye and gets people to read your call to action.
On the other side of the spectrum, you can put a ton of thought into specific color selections. Color theory is as deep as global culture. For example, the color yellow has cultural associations to Hindus as a sacred color, but in Greece it’s the color of sadness, and in France it’s the color of jealousy. In America, green can be a color for money, for jealousy, for springtime, or for the winter holidays. There are whole websites dedicated to listing elements of color theory, and they vary depending on the culture and location of your target audience.
So, you can pick a color based on what stands out on your site, or you can pick a color based on what emotions you want to express to the people who visit your site. Then you test. Change your colors, go against your intuition, and see what colors attract the most traffic and the most conversions. Color is at least the easiest to optimize. All you’re doing is changing a hex value or two.
The button text for your call to action is possibly the most covered topic in all of marketing. There is so much hatred for the cliché “click here” button you’re liable to give someone an aneurism if you use it.
As many rules as there are for what not to do, there are an infinite number of ideas of what to do. Neil Patel on his blog uses “get more customers” as a CTA button, so let’s take a look at that. The button in the headline doesn’t have a lot of surrounding context, so it’s generic and meant to stand on its own. It tells you what you can get out of it – more customers – and doesn’t make mention of what specifically you’re getting or what the cost of that will be. Those are elements of information that might turn you off, so they’re left to the landing page behind the CTA.
Your call to action should focus on what the user gets. “Start my free trial” is a way of showing the user they get a free trial of your service out of clicking the button. For some services, a more specific CTA can be more beneficial, like Crazy Egg using “Show me my heatmap.” It doesn’t indicate free, but it tells you that you’re going to get a heatmap out of it, and since you’re already browsing Crazy Egg, you probably already have an idea of how valuable that can be.
You should also avoid generic phrases. The “click here” and “join now” calls are so basic that most people barely even acknowledge them. They have no value proposition, they have no draw, and they rely on context to give the reader an idea of what they’re getting. The trouble is, the point of a CTA button is to be the center of attention, to get that attention first and foremost. If the user doesn’t click it then, the chances of them clicking it later once they’ve read around drop.
Of course, for every rule there is the exception. Hubspot uses “get started” in their top bar navigation, even though it’s a generic CTA and there’s no real context to the CTA on any individual page. That’s because every element of their entire site is pointed in one direction, which is teaching you what Hubspot does and what the benefits are. The “get started” CTA is at the top of every page, and is thus always there for whenever you decide you want to click it.
Location will vary depending on the purpose of the call to action.
Different locations have different pros and cons.
Position, then, is largely determined by purpose, but you can also test the same CTA in different positions to see which purpose is best for your offer. Remember, testing is the name of the game, with each and every aspect of putting together a CTA.
Growtraffic.com is the leading pop-under traffic network.
Get thousands of targeted visitors for wholesale prices.