Conversion Optimization: Where is the Best Place for a Call to Action? [case]

Original author: Oli Gardner
  • Transfer
The call to action on the landing page is one of the stages of the sales funnel, often very important for increasing the conversion to paying customers. When placing a call to action button on a landing page, many website owners follow the same stereotypes and patterns and are afraid to experiment. Moreover, when placing the call-to-action button on a large number of sites, they seem to have forgotten to use elementary logic, the employees of these companies are clearly not trying to track the movements of the site visitor and direct them, and they are not testing different CTA options. In this article by Oli Gardner, written in the first person, numerous variations of the placement of the call to action button are analyzed, the author analyzes which of them are most effective and which are wrong, and draws several conclusions and recommendations on placing CTA on the landing page.



Once I was sitting in a coffee shop (okay, okay, in a bar), and the Pearl Jam song “Last Kiss” began to play. Being obsessed with metaphors, I began to change the words of the first stanza to marketing terms, using CTA (call to action) instead of the word “child”. Call it insanity or inspiration - whatever you want, but in the end I created this post, which will talk about where it is best to place a call to action on your landing page and why.

First, let's read the beginning of the song together so that I can get stuck in your head for a while, like songs like “I think we're alone now” by Tiffany do, which you hum a few days after you hear.

Original version (translated):

Where are you, my child?
The Lord took you ...
She went to heaven, left me,
I hope to meet you,
When I leave this world and I.


My version:

Where are you, my CTA?
The site is hidden from me,
I'll look for a landing page, because it’s not bad,
Oh help me find CTA, my God!

I should seriously consider building a career in music marketing, right? Not? Well, okay.

In this post, I will analyze the following ideas for placing a call to action on a landing page:

  • At the beginning of the page (before the fold - the line of "fracture" of the page).
  • At the very bottom of the page.
  • Under the fold, but using guide tips.
  • CTA placement cases.
  • Button layout among many other CTAs.


The place on the landing where you place the call to action can have a big impact on the conversion, which I will talk about later, citing specific cases as an example.

I can already hear the screams “In the upper part, in the upper part, above the fold!” - Boredom of the

Internet has evolved, user behavior has also changed - marketing should be developed according to this. Now, not only what is commonly referred to as folding — the line of “turning the page” means more than before — but the way your visitors read stories on your site has changed (unless, of course, you know how to tell stories correctly on a web page) .

A history lesson : since the creation of MySpace, Facebook and other long sites, as well as the invention of the scroll wheel on the mouse, everyone is used to scrolling the page, it has become a habit.

In addition to this, placing a call to action right in front of the site visitor’s eyes even before they have penetrated your message about the product is about the same as immediately moving to the second base, bypassing the first.

This is not to say that placing the CTA at the top of the page, above the “fracture line” is a mistake, in most cases it is a good idea. However, you should not be afraid of experimenting with your selling history and use different ways to convey the value of the product to the user.

Consider the heatmap below, according to which, if you place less content at the top of the site, users are more likely to scroll to the end.



The simple design of the top of the page to the fold line encourages users to scroll down.

Now that I have set the stage for the conversation about placing a call to action, let's look at the five promised tactics. I hope they inspire you to test your next CTA.

1. Placement of CTA at the top of the landing


I cannot help but talk about placing a call to action at the top of the page, because this is still the most popular choice of location. As I mentioned above, this method of placement expects everything from the site visitor at once.

What I would like to offer, I call a 5-step blow, and it works as follows:



1. A catchy and informative headline: one that will make you stop when you catch a glimpse of it in a newspaper machine on the street.

2. The subtitle supplementing it: it is necessary so that you can make your headline short and effective, and at the same time provide additional information that would turn your headline into complete nonsense if you tried to fit all the data in it.

3. A brief indication of the main advantages: it describes the key advantages of your product or service.

4. Limited special offer: this motivates users to click. Examples include a time limit or an available product quantity offer (Expedia, for example, says that there are only two seats left for the flight required). A special offer, such as a discount, also encourages you to click on the call to action button.



5. A call to action that accurately describes what the user will receive as a result: he must be closely connected with the headline so that the purpose of your page is even more clear and precise.

Using these five steps, you can create a miniature user engagement even above the fold, which can improve your conversion potential at the top of the page.

2. CTA below the fold on the selling page - AIDA


Let's remember the old school for a second. Do you remember the marketing concept called AIDA?

The abbreviation stands for Attention, Interest, Desire, Action and is based on the idea that the visitor goes through a certain sequence of simple steps on the path to deciding to take an action. The template below illustrates this process, and this is a good example of placing the CTA at the bottom of the page when the user has already followed the development of your selling history from beginning to end.



Let's look at this template to illustrate how AIDA principles work:

  • ATTENTION (attention): you attract the attention of visitors with a relevant and catchy headline.
  • INTEREST (interest): With the help of video you interest visitors.
  • DESIRE (desire): a desire is formed through the use of functions and advantages that appeal to the needs of visitors.
  • ACTION (action): and finally, a powerful call to action ends the story at the point where the visitor is already convinced that your decision is complete
  • will satisfy his needs. In this case, contrast and color work, as well as a clear definition of what he will get when he clicks on the button.


If you can turn the text of your page into history, then the AIDA technique can be a very effective way for you to create a landing page for you.

3. CTA Fold Using Guide Tips


Sometimes you can do nothing but put the CTA under the fold, and the best example of this is a long form for collecting contacts, where the call to action button is located below. To encourage visitors to scroll down the page, use directional tips to influence their subconscious mind.

The correct place to place them is the heading of the form itself, pointing down to the form (filling in which is a conversion action). You need to look down to let the visitor know: below on the page is even more information.

Here is a good example:



Another good example is the sidigital animated web page , where they make us glance at the page lower and lower in a very interesting way.



Fluid slides into the pipes when you scroll the page. It seems to me that users really freeze on this page for a long time.

4. Placing too many CTAs on the landing page


Good luck to those who are trying to understand exactly what actions are expected from the client.



This is a metaphorical example of too many calls to action on the notorious landing page. Trying to figure out what you should do on this page is the same as looking for a needle in a pile of other needles!

5. Case for the placement of CTA on the landing


In this A / B test, we experimented with the Unbounce landing page with traffic driven through contextual advertising using the pay-per-click model (AdWords). Please note that calls to action are located under the fold at the bottom of the page. To mitigate this, we used a minor navigation CTA at the top of the page saying “choose your tariff below”, and also used the smooth scroll effect to move down the page to the tariff plans. The smooth scrolling effect allows the visitor to see how much content is on the page while he is scrolling through it. Also, immediately noting that the tariff plan will be located “below”, the visitor understands that at the bottom of the page is important information that you need to familiarize yourself with before you leave the site.



The hypothesis proposed by our marketing director at Gia was that by moving the CTA above the price grid, we will see a sharp increase in the number of clicks on the active link. To test the hypothesis, CTA was placed at the top of the bottom half of the page (after smoothly scrolling using the button located at the top of the page). Earlier after scrolling down there was a chance that the call to action was still invisible.

Results: In option B (page after optimization), the conversion increased by 41% compared to the original version.

To summarize


I hope you learned something useful from this post about posting a call to action. To summarize, here are some tips on what is and is not worth doing.

What to do:
  • Perform A / B testing to determine the best place to place your CTA.
  • Use multiple calls to action on a long page to break it into several mini-sections.
  • Use guides (visual or text) if the CTA is under the fold in the bottom half of the page.
  • Create a competent marketing story to guide the user to your call to action, wherever he is.
  • Using a well-designed design, make the CTA catchy (contrast, empty space around).


What you should not do:
  • No need to be afraid to place the CTA under the fold in the bottom half of the page.
  • You should not place the CTA in the already filled with various buttons area.
  • It’s better not to use multiple calls to action, unless they serve the same purpose.

Only registered users can participate in the survey. Please come in.

And how would you place a call to action button on a landing page?

  • 34.1% At the very top of page 44
  • 26.3% At the very bottom of the page, as the logical conclusion of the selling text 34
  • 25.5% At the bottom of the page using guides 33
  • 33.3% I don’t know, first you need to test all the variations 43

Also popular now: