Jason Lance is a seasoned UI designer and a user-experience Sherpa. For more than ten years, he’s been honing and perfecting his craft by consistently designing compelling websites that drive traffic and convert visitors into clients. One of the first steps to conversion is putting some thought and strategy behind each page’s call to action (CTA). So without further ado, take it away, Jason.
There are many things to consider when designing a call to action. Here are a few:
The color selected for the CTA should stand out from the rest of the website. It’s helpful to have a single color in the palette dedicated to “action” items throughout the entire site. The color selected is also important; green, red and orange are common action colors.
There are many ways to provide visitors with directional cues. One technique is to use a photo of someone looking in the direction of the CTA. Another is to literally use an arrow that points to the CTA.
Make sure there is plenty of space around the elements on your page. This will keep the design uncluttered and will help the CTA stand out from the rest of the content. If you try to display too much in a small space, everything will bleed together and the prominence of the CTA will be shattered.
Rdio and Skype both do a great job at using white space to keep the design simple and uncluttered, allowing the visitors to focus on the key information. They also do a good job at highlighting the CTA whether it’s through color or directional cues.
There are two basic approaches to the placement of a CTA —top and bottom. Top refers to placing the CTA at the top of the page along with some key information. The other option is placing the CTA at the bottom of the page, after a more in-depth pitch has been presented.
The top is the most common place for a CTA. This approach tends to be more effective on landing pages, where you can limit the content to a handful of critical items. A powerful and descriptive headline, along with a brief statement that explains the benefits of your product or service, are followed by a call to action. The key here is not to have too much content.
This approach leverages an old marketing strategy called AIDA, which stands for attention, interest, desire, and action.
- Capture the ATTENTION of a visitor by using a bold, relevant headline.
- Gain their INTEREST by explaining how your product or service can help them.
- Create DESIRE by communicating the unique benefits of your product or service.
- Create a strong call to ACTION that allows your visitor to take the next step.
This approach is best used in situations where the user needs more incentive. It’s also ideal when the product or service is unfamiliar to your users and needs more explanation.
ABC: Always Be Closing
Make sure every page in your site is doing its part in converting your visitors. When your visitor are ready, they should have easy access to the next step in the conversion process, whether that is getting more information on a product, supplying an email address, or entering shipping information.
Avoid Choice Paralysis
Choice paralysis occurs when a user is given too many options. Providing too many options can cause stress and debate for your users. Sometimes this will result in visitors declining to make a choice at all. To avoid this, limit the choices to as few as possible and label the choices with tags like “best for…” Create an easy choice by labeling one of the options as “best value” or “most popular.”
Make It Better
You’re never going to get it perfect the first time. Use tools like AB testing and heat mapping to fine-tune your action items. Subtle changes such as changing a headline can make a huge impact when it comes to conversion.
Thanks Jason! We hope you’ve enjoyed our introduction into building effective calls to action. In the coming months, Jason and our design team will be going more in-depth on few of these strategies we mentioned above. You should hear how much these guys have to say about color cues and whitespace —it’s a little ridiculous.