In the previous installment, we promised you more advice to come. So it’s my great pleasure to bring you our second installment of CTA best practices!
While we tackled in-button practices before, this week I want to focus more on external factors that can play a vital role in the effectiveness of your CTA. Without further ado, here’s:
There are two things to pay attention to here: Context and Location. To start with context, your CTA should always be relevant to the topic on the page it is placed in. Just as it wouldn’t make sense to advertise for a Bieber concert at a sports bar, it wouldn’t make sense to talk to your viewers about one thing, then invite them to do something else. The CTA should act as a continuation or as a complement, it can either invite people to take the next step or download related information.
Now let’s talk about location. Location, location, location. Here's an idiom I really enjoy: “above the fold”. Remember in olden days when people would read a printed newspaper? They would buy it folded in half and it would be designed so that the top half would portray the most important information. This way, a person walking by wouldn’t have to unfold the paper to read the important headline. How does the concept of a “fold” apply to a website? The fold-line (if you want to call it that) is basically the line where viewers have to scroll down to continue reading. So whatever appears on your page that viewers can read without scrolling down is “above the fold”.
So what is the important information that you have to place above the fold? Essentially, you should have a clear value proposition and a relevant CTA. As you develop your copy and cross the fold-line, you need to make sure that you repeat the CTA at the bottom of the page, to remind your viewers of your invitation as well as provide them with easy access.
In this example, Flattr has the "Learn more" CTA right next to the value proposition (support these projects with 1-click micro-donations). If you click the CTA, it would open a pop-up that has an informative video and more useful information to support the value proposition. All of this is at the very top, way above the fold.
Who’s seen Minority Report (if you haven’t, watch it today. Great movie!)? In the futuristic world that Tom Cruise lives in, ads follow you wherever you go. Not only do they appear, they speak and address you by name. There is a particularly disturbing scene when Cruise is walking along a corridor and the sounds of about ten ads are surrounding him. I remember thinking to myself: if I were in his shoes, I’d fall dramatically to my knees, look up towards the sky and yell: “WHAT DO YOU WANT FROM ME?!”
To take it down a notch (or five), you don’t want to overwhelm your viewers with CTAs. Having competing offers creates a lot of confusion and your viewers might end up abstaining from both, which will reduce your conversion. A great way to avoid this confusion is to create a visual hierarchy. Decide what your most important CTA is by seeing what’s most relevant to the main objective of your page and make that the most attractive one. The other CTA (if another one needs to exist) should be smaller and considerably more toned down.
I’m going to bring back an example I used the previous time because it applies so beautifully here. Mozilla has two offers to share with us: Firefox Free Download and Get Firefox for Android free. Their main concern is the first offer so they made it nice and big with a contrasting color. The Android offer is much smaller and of the same color as the background, so it blends in well, leaving the biggest spotlight to the first CTA. Neat!
Very recently I found myself in a really awkward situation. During a wedding, my friend slipped and fell into a fountain, which would have been embarrassing enough in normal circumstances, but unfortunately for her, the hem of her dress caught on something and when she tried to get on her feet, the dress was torn into pieces. A few days later I made a joke about it which hurt her feelings. In response she said: “I’m not comfortable laughing about it yet”. My timing was off. Had I waiting a bit longer, she would have accepted my comment and laughed about it. Instead I mumbled and apologized, feeling like an idiot.
The reason I tell you this story is to highlight the importance of timing. In a previous blog article, I took you through the stages of the customer lifecycle to help you understand the mindset of your viewers throughout the stages. You have to be careful to pace yourself according to their wants and needs. The easiest way to go about it is to use HubSpot 3’s dynamic content. Put simply, dynamic content is content that changes based on a visitor's profile or how far along they are on the customer lifecycle. These changes are created by using a set of rules that you can edit in the HubSpot CTA editor. You don’t ever have to worry about going too fast or too slow.
Excuse me for stating the obvious, but your viewers won’t be able to do anything if your CTA does not function. Check, double-check, and triple-check that you have linked it to its corresponding landing page. The landing page itself has to inform viewers that they have reached the right place. Make that obvious by using the exact same design elements as well as language or copy present in the CTA.
Following the advice listed in these two installments will ensure that you have a happy, healthy, and effective CTA to boost your conversions. If you have ideas of your own, please feel free to leave a comment below. That’s all folks!