October 20, 2011

Correct use of ‘Call to Action’ Buttons

It may seem a little over the top to write an entire blog post about buttons but, you’d be surprised at just how much effect the design of a Call to Action button can have over converting visitors.

It’s not uncommon for companies to spend huge amounts of money on SEO and PPC for their websites in an attempt to increase conversions. But often the real problem with their site is something that no amount of traffic can rectify – they have a poor call to action. Driving traffic to your website is important, but what‘s the point if the primary call to action is nearly invisible?


As a one of the web designers here at Logic, the task I set myself when creating as new design is for the main Call to Action to be easily found as quickly as possible so that users don’t give up and leave! A simple “Click Here” link, hidden by reams of text won’t generate great results. Having a well-designed call to action that is obvious and jumps out at viewers could make all the difference. In order to create a perfect Call to Action we would suggest following five simple C’s…

1. Colour

The colour of your button should stand out from the rest of the page; therefore we often use a complimentary but contrasting colour. Just like warning/attraction body markings in the animal kingdom, colour will draw attention, especially if the rest of the site has a fairly muted palette.

However, you need to ensure you select colors that fit the color scheme of your website. If you start using random colours in order to get your button to stand out will look cheap and unprofessional. By choosing a color that stands out from the rest of the colors used within the page you will reinforce its significance.


2. Context

The position and where you place your call to action is imperative in order for your potential customer to easily find it. Firstly it helps if it’s ‘Above the Fold’ (not requiring users to scroll down to find it) as this gives it higher value in the page hierarchy and thus allows it to receive more impressions.

It’s vitally important that you position your Call to Action directly in the eye path of your clients so that the position feels almost intuitive; it should be obvious, in a logical area and not be difficult to find.


3. Copy

The text you use on your button is important. It should be succinct, snappy and should be exciting in its language in order to encourage interaction.

Another top tip is to give the user a reason to click on your button, using phrases like ‘totally free’ or “Only 10 remaining” will create a sense of urgency and make people want to click the button all the more!



4. Colossal

They say that size isn’t everything, but it’s certainly crucial to consider when creating your button! Web designers often get annoyed by clients who constantly want everything increased in size. However, similarly to ‘Context’ this is all about giving your Call to Action importance so that your clients want to click it. The larger it is, the more chance of it being noticed!

There is also a practical aspect to consider, if a button is physically too small to click on it can be frustrating, you want to give the user as much area to click on as possible. But you can go too far and create a call to action that is so large it looks ugly or worse, doesn’t look clickable.



5. Congestion

When it comes to making sure your button is noticed, the simplest way for it to stand out from the crowd, is for you to ensure it isn’t overcrowded with other elements!

A good web designer will be able to use ‘whitespace’ around a call to action button in order to effectively make it stand out in areas where there are many other elements. Up to a point – the more space around your button the better, if you clutter it with surrounding content it will be lost in the noise of the overall page!

If you follow these simple steps you’ll have a button that not only looks fantastic, but ensures that you convert. It will also mean your users will intuitively be able to move through your website in a logical, methodical fashion, ensuring they can tap into the relevant information for them.


Like the look of these examples? To tap in further to our web design expertise, why not speak to us about your website and what we can offer you and your company. Take advantage of our award winning design today and get in touch on 01284 706842 or email us at