Creating Effective Call to Action Buttons

Posted on - Last Modified on

The call to action button is arguably the most important element on a page. The page exists because you want a user to perform an action, and the gateway to that action is the call to action button. The more people who click, the more successful the page will be. But how do you create call to action buttons that get clicks? Here are some tips.

 

It Has to Look Like a Button

 

This is obvious, right? Of course. But some people still apply designs to buttons that make them blend in with the rest of the content so it is not exactly clear what the user is supposed to click.

 

Instead, you should make your button stand out on the page, and it should clearly be a button. Design elements such as contrasting colors, rectangular shapes, and clear boundaries between the button and the content can help you achieve this.

 

Location

 

You should position your button so that the user can intuitively know what the button does, and that it is the next obvious course of action. For online product pages and shopping sites, this usually means a button located directly below an offer, price, or brief description.

 

Size

 

There are no hard and fast rules with call to action button sizes, except that it should be the largest button on the page. Other than that, you should ensure that the button looks natural. This means making it big enough so that it catches the eye and is obviously a button, but not so big that it looks out of place or overbearing on the page.

 

Color

 

Your button has to stand out on your page and using a good complementary color is one way to achieve this. Avoid white buttons on a white page and go for a color that contrasts with the other content on the page, but does not look totally out of place.

 

Text

 

Make the language on your button concise, simple and direct, and tell the user exactly what they are doing. For example, if you have an email sign-up form with a call to action button, don't label it as "Submit". Instead, use something like "Subscribe" so that there is no doubt about what it does.

 

Options

 

It is always best to have just one option on the page. However, if you must have more, limit it to two and make sure the differences between the options are clearly defined. Also, make sure that it is obvious which button the user should click on next.

 

Background - Copy and Design

 

Now look at the background of the page. This is where you can use color to contrast with the color of the button. It is also a place where you can create urgency and compel the user to click on the button.

 

Finally, make sure you test everything above. For example, will changing the color of your button improve conversion rates? Or do you get more clicks if you change the text, or create more urgency in the message above the button? You won't know any of this unless you measure, test and analyze.

Posted 2 March, 2015

Happymarli

Proofreader, Editor, Writer and App Developer

Do you need a professional editor and writer to proofread your technical documents, thesis, novel, statement of purpose, personal statement, resume, cover letter, manuscript, essay, short story, textbook content, or articles? Do you want to make sure that your marketing material content is flawless and appealing to readers? I can do any of that! I am a professional editor (academic, copy, line/su...

Next Article

Developing Web Applications Using Node.js Part 1