A call to action in web design is a term used for elements that grab the users attention and draw them to a certain goal, usually it’s a button or line of copy. To create a good call to action, you have to consider the user’s objective. Every time a user visits a site, they have an objective, or goal they’re looking to complete. It could be that they are looking to find out more information about a product, to purchase an item or to get in touch.
Whatever the reason the user is on the site, you have to give them a clear and easy route to their goal. To do this you first need to start by identifying the questions you want the site to answer, then prioritising them and arranging a hierarchical structure to follow. Analytics can help you make the decision on the most important goals, but may not always be available, this is where best guesses from experience come into play.
Working with the client you should look to agree the most important answers for your site to offer, as overloading the site with excessive content and competing calls to action will result in too high levels of choice and eventually give you a bloated, inefficient site (For more information about the drawbacks of excessive choice, see my previous blog – 4 Web Design Guidelines You Can Use Today ).
Once you’ve got your list together, you can start to look at how you’ll display your calls to action. There’s several ways to draw the user’s attention and entice them to walk the road you’ve made, below I’ve listed a few (with examples) to get you started.
It’s pretty simple, the bigger your button or message on a page is, the more it’s going to catch the user’s eye. This will only work to a certain extent, and going too big will overwhelm the user and leave you scratching your head why your new shiny landing page isn’t converting.
Look at the size of a call to action in relation to the elements around it, making the logo the biggest thing on the page isn’t going to get more sales, but pushing focus towards your “Sign Up” button will.
Whitespace can be a huge positive to a call to action, allowing a button to have room to breath can help it stand out more, cramming a load of buttons into a small area will only confuse the user. If you’ve got a busy page and put a good wedge of space around the button, you’ll draw more attention to it.
Make sure you don’t over do it and leave a button looking lost, make sure it’s clearly related to any copy or imagery nearby.
Don’t let your calls to action fade into the background, make them stand out. Use highly contrasting colours to give them that bit of extra presence on the page. Contrasting colours can be used on text, buttons, imagery and well, everything. Make sure you don’t overuse extreme contrast as you’ll lose the desired effect.
Certain colours will help you perform better, check out my blog about Colours in Web Design for advice on selecting the right colour to entice a user to a conversion.
Back up your main call to action with a supporting one, maybe you’re main call to action is “Buy Now”, your user may not be ready to buy now, so what do they do? Help them out and give them an extra call to action, maybe with slightly less contrast and slightly smalling, offering them more information on the product.
Showing urgency with your call to action can result in some impressive uptake in conversions. Terms like “Call Today” or “Buy Now” work a lot better than “Call Us” or “Buy”. You can go even further and put more pressure on the user to complete the action straight away with “Order Now, only 5 in stock!”.
This is all great in theory, but it’s kind of a missed point without examples, so below I’ve listed a few calls to action that have caught my eye.
Apple – As always, Apple’s site makes it into my list of examples. They use strong imagery and simple copy to draw the attention. Good use of the AIDA model.
Microsoft – Using strong vibrant colours against a light background the contrast really draws the attention, supported by the good use of imagery.
PayPal – Simple and to the point. Clear objective set, sign up, and that’s pretty much all I feel like doing on this page.
Play – It may look a bit bloated and cramped, but Play still do a good job of giving me a route (or 10) to follow.
Adidas – Great imagery (staring some famous faces) really draw you in. The supporting text helps you feel like your life could be changed with their latest trainers.