“Your call-to-action should always be above the fold!” You’ve probably come across that golden rule of optimization more than a few times. Chances are, you’ve used the rule yourself. Years ago, I followed it religiously! But then I started testing, and guess what I found out? It doesn’t hold up in practice. Here’s a case study where a landing page treatment, with the CTA placed way under the fold, outperformed the control version (CTA above the fold) by 304%.
Background
The client has asked to be anonymous, but I can tell you that it’s a Danish company I worked with last year. They offer a subscription service where busy families can get dinner recipes and ingredients delivered to their doorstep 3-5 times a week.
They hired me to do a landing page for their PPC-campaigns with the goal of getting potential customers to fill out a contact form so sales could approach them.
The offer itself is pretty complex, and you need quite a bit of information in order to make an informed decision. So it ended up being a long-form landing page with the CTA/form positioned at the top of the page.
Here’s what the control version looked like:
The blue circle shows the position of the call-to-action. The page is in Danish, so I didn’t upload a larger version where the copy is readable.
The test:
I ran a number of tests on the page and achieved some minor lifts, but I couldn’t really get conversions up as far as I had hoped. However, at some point it dawned on me that having the CTA at the very top of the page might be too aggressive.
Taking the complexity of the offer into consideration, the potential customers might have felt pressured by the fact that the CTA was right in their faces the second they landed on the page.
I decided to really swing for the fences on this one and ended up moving the CTA all the way to the bottom of the page. I set up an A/B split test and let it run until it had a sample size of around 100 conversions and a 98% level of statistical confidence.
Here’s what the treatment looked like:
The blue circle shows the position of the call-to-action.
The results:
The results were pretty staggering: Treatment A outperformed the control version by 304%. That was quite a bit more than I had expected, to say the least!
If you look closely, you’ll see that there are a couple of variables apart from the position of the form. The main one being that Treatment A features a picture of different dishes in the space where the CTA was on the control version.
It’s hard to say to which extent these variables influenced conversions. Nevertheless, the fact is that Treatment A, with the CTA positioned below the fold all the way at the bottom of the page, performed significantly better than the one with the CTA above the fold. Something that simply shouldn’t be possible if one were to go strictly by the rule of best practice.
Main takeaways:
All landing pages, products, offers, and companies are different, just like the motivation of potential customers is going to be different. The point is to find out what works in your specific case, on your particular target audience.
I’ve seen many cases where the CTA has performed well above the fold, just like I’ve seen cases similar to this one, where having the CTA below the fold has gotten the best results. My general observation, from a wide range of landing page tests, is that there is a correlation between the complexity of the product/offer and the optimal placement of the CTA.
If the product/offer is complex, and the prospect has to digest a lot of information in order to make an informed decision, positioning the CTA lower on the page generally works best.
Vice versa, if the product/offer is very simple, and the prospect hardly has to do any thinking in order to make an informed decision, positioning the CTA above the fold generally works best.
You can use this as a guideline for your next landing page – but remember: “Always be testing!” It’s the only way to gain certainty that you’ve found the optimal CTA placement for your particular landing page.
Back to you!
What’s your experience with CTA placement? I’d love to hear your thoughts. Drop a line in the comments section, and let’s start sharing knowledge. Also, if you have any statistically significant case studies that you’re willing to share, it would be very interesting to see your results.
Since you didn’t specifically ab test the CTA location, it’s hard to describe the test the way you did. I agree that it’s plausible the early CTA was too aggressive, but it’s not conclusive. Especially for a lead gen offer, where typically short copy can do really well, even for complex offers.
I’d challenge you to cut the offer down to a free 30 day trial, 1 headline, 2-3 bullets MAX, and your same form. Then see what happens..
p.s. I tried typing my name in lower caps but it didn’t work.
Hi Gab – thanks for the comment.
In this case, the objective was to challenge the best practice “Always place the CTA above the fold.” The research question was: Which variant will before better – the control /CTA above the fold) or the treatment (CTA below the fold).
The test design was a simple A/B split with a 50/50 distribution between variants. The sample size was 100 conversions (conversions not visits), the statistical confidence level was 98%, and the standard error was <1%.
The result was that the treatment outperformed the control by 304%, and the answer to the research question was “The treatment (CTA below the fold) performed better than the control (CTA above the fold).”
I’d venture to that all the abovementioned facts provide the basis for a pretty conclusive test…
Testing a variant 30-day trial on a short-form landing page is interesting. However, that would be a completely different test and we’d no longer be challenging the “Above the fold” myth, we’d be testing whether a short-form LP performs better than a long-form LP, or whether a free trial performs better than an introduction offer. Thus we would also have to come up with a different research question.
But funny you should mention it, because the first thing I did for this client was to challenge their original short-form LP that consisted of a headline, a few bullets, and a paragraph. My long-form LP more than doubled conversions…
The free 30-day trial is an interesting approach but – as mentioned in the post – the product in question is a physical service where you get ingredients and recipes delivered to your door. The costs involved with the supply chain and delivering the product make it difficult to justify a free 30-day trial. Thus the company has chosen to go with a special introduction offer involving a discount.
Thanks for the heads up about the caps, it’s setup by default in the theme I’m using, but I’ll look into changing it.
Thanks!
- Michael
Michael,
Congratulations on a huge increase in conversions! It’s easy to read this and think, “Oh, I guess in every case, we need to put the CTA below the fold!” But, as you noted, “find out what works in your specific case, on your particular target audience.” Do you feel like women were main TA and they felt having the CTA at the top was too pushy? Just curious. Thanks for the article!
Hi Darren – thank you very much!
Good point – what a backfire if I actually ended up inventing yet another lame, generic best practice
Like you said – The goal here is to inspire people to test what works on their specific page instead of relying blindly on best practice.
I don’t think the results had much to do with the demographics. My hypothesis is that, because of the complex nature of the offer, it’s way to early to ask for a conversion the very second someone lands on the page from a PPC add.
Dr. Flint from MarketingExperiments uses the analogie that asking too much too soon on a web page is like walking up to a girl in a bar and asking her to marry you before she’s even had a chance to find out the first thing about you
Thanks for reading – hope you stop by again soon!
- Michael
Hey Michael – I love that you had the idea to ‘swing for the fences,’ this is generally where ideas for many of the best variations come from.
I will say that I don’t believe you can attribute you massive lift to the CTA location. If you boil down all of the attributes on the page that were changed:
1. The pictures of the dishes that customers would receive recipes for
2. Moving the testimonials from a vertical stack to a horizontal span
3. Making the social proof with 40% call-out both centered and significantly larger
4. Changing the positioning of the grocery images from vertical left-aligned to horizontal full-width
5. Adding additional graphics, button, and call-out to conversion offer above the sign-up box
There is really no way to attribute this lift solely to the location change of the conversion form. This is something I actually explained in relative depth in a recent presentation on making sure you use real (and accurate) data both for test planning, design, and especially success attribution. Feel free to check it out if you like: http://www.slideshare.net/nickeubanks1/split-testing-using-real-data
I don’t mean to come off negative at all – I’m honestly thrilled that people are beginning to challenge what have been toted as ‘best practices’ which very well may have evolved beyond their legacy applications.
Thanks again for the post.
Hi Nick – thanks for your comment!
I agree – in fact, in the post, I make a point of mentioning that there were other variables in the test that would have affected the result as well.
The point of this case study was to challenge the myth of the “CTA above the fold”, and the fact remains that the variant with the CTA placed below the fold all the way at the bottom of the page significantly outperformed the variant with the CTA placed above the fold a the very top of the page.
Thanks for reading and commenting – I appreciate your feedback and hope that you’ll stop by again soon
- Michael
I was going to basically say what Nick said here. There’s a lot going on here, as you noted, but I think it’s quite significant that you broke the left margin with the CTA. I do love that you’re challenging some common assumptions, and I would love to see some additional testing.
(Related: http://blog.kissmetrics.com/shocking-truth-about-graphics/)
Hi Carson – thanks for your comment!
The main thing I’ve learned from split testing is that human beings and decision making processes can be pretty unpredictable. Which makes a strong case for being scientific and challenging the common assumptions.
I have a back catalogue of 200+ split tests and more coming in every week – so stay tuned for many, many more upcoming case studies!
- Michael
Proof that possibly ‘small’ changes can make HUGE differences. Split testing should never end in this business
True dat – Split testing is king!
- Michael
Great experiment! I was thinking for the two sites I am working on to place a CTA on 2 spots (example: on blog post on the top right corner and bottom of post), but this experiment is now guiding me into different direction. Thanks for sharing.
Hi Chande – my pleasure, glad I could help!
There are a lot more experiments and case studies on the way
- Michael
Hi Michael,
The comments above already made the first point I was going to do.
But there’s one more thing you A/B test… I think if you double the CTA either to above and below the fold, you could see some interesting results.
Let me know
Hi Alexandre – thanks for your comment!
Yes, that’s an interesting idea, I’ve considered it myself.
However, I don’t work with the client anymore, so I can’t test it.
- Michael
Great stuff Michael. I like that you quoted Flint in your comments. Perhaps adding that additional context to the blog post would help people relate better to your primary thesis here.. that the landing page is a conversation…. and you don’t start a conversation by saying “Buy this now and I’ll tell you why you should later”..
PS. Love the way you show your results just like our boys at M.E….
Cheers
MATT SILVERS recently posted..Is Offering Free Shipping to Your E-Commerce Site Nice to Have or Essential?
Hey Matt – thank you very much! I’m glad to hear you like my new blog!
Great idea with the Flint quote – I’ll have to incorporate that!
Stop by again soon
- Michael
Amazing post Michael – I wish everyone would have this outlook!
Thank you very much Adam!
There are plenty more case studies on the way
- Michael
I think I could do a similar test with my newsletter subscription section to see how does that perform below the fold once readers are done with reading the article on post page. What say?
My site is designingtips.com and I’ve recently just been focusing on adding more and regular content to it, less conversions & monetization.
Jay Mahal recently posted..Eco-Design Ideas for Retail Spaces
Hi Jay – That would be a great experiment!
I’d love to hear about your results, once the test has been concluded.
- Michael
I will make sure of letting you know about the results Michael. Thanks for an eye-opening article here
Cheers!
Jay Mahal recently posted..Innovative Hour: Asheville Community Design Lab After-School
This article is really interesting because common practice have always taught us to put optin box and CTA boxes above the fold.
But based on what you’ve found, it depends on the complexity of the content. If the content is easy to digest then put the content above the fold. But if it’s too difficult and technical to comprehend, below the fold would increase my conversions for my CTA boxes, right?
rYAN recently posted..Commentluv Enabled
Hi Ryan – Yes, that’s exactly my experience.
But my main point is that you have find out what the best placement is on your page. And the only way to do that is to test it in real life on your potential customers.
- Michael
great to see someone actually do it differently. Everyone religiously follow what others say and wont try things like putting the CTA in other places other then the right side or in this case at the bottom.
Great post!
puya recently posted..15 Ways To Improve Ecommerce Conversion Numbers
Thank you very much Puya!
You still have the chance to enter the contest to win free call-to-action optimization and split testing.
Check it out here, and see if your landing page qualifies:http://contentverve.com/competition-get-your-call-to-action-optimized-for-free-including-ab-test/
- Michael
What if we add both top and bottom CTAs? Is this overkill in your eyes?
Hi Benny – Thanks for your comment.
It’s difficult to say without having seen the landing page. It depends on the individual case.
If you send me a URL or a screen dump, I’d be happy to give you my thoughts. My email is: michael@contentverve.com
- Michael
interesting read, i have started playing with my layouts but never really considered moving the cpa cheers
Frankie Boy recently posted..PremiumPress MoviePress Theme
hey Michael,
you have a very interesting case study here, congrats!
now, I feel the need to answer this suggestion:
“Your call-to-action should always be above the fold!”
not to prove it wrong, but show when it’s valid…
Yes, you need to have your call-to-action above the fold in any of these situations:
1. When you’re doing a pre-launch to your mailing list or to an audience who has read about you/your product before — and all they care about is the order button…
2. When you’re focusing on “instant gratification” buyers or opt-in mailing list subscribers, who dislike scrolling, and just want the goodies right there, right then!
3. When you care about numbers – you prefer quantity rather than quality of the prospect/client.
There’s no CTA case study I can share with you, as that’s not what I do online, but my findings were from personal testings and what I’ve seen others do on the Internet: how people buy and click, etc.
Hope it helps
John @ 109 Sales/Day Affiliate recently posted..Is Your Company Being Advertised Through Google Places Yet?
Hi Michael,
Challenging the current thinking can only ever be a good thing! Always keen to read about new ideas.
However, I don’t think this test necessarily proves that CTAs are not always better above the fold – essentially there are too many uncontrolled variables. Your hypothesis might very well be true, and I would be very happy to see it tested in isolation, but the different page designs above can only contribute to further testing, forming two outliers within which to design further.
To be honest, I suspect that what you have actually proved in the above test is that engaging the user is vitally important. The Control is visually unengaging above the fold – extremely text heavy, no imagery, few interactions, with an uneven vertical modular layout. It is not surprising the page converted poorly. The Bounce rate and Dwell time of the page would be able to quantitatively establish this.
Conversely, the Variant has bright, colourful and relevant imagery in exactly the right location, there is a clear and neat modular structure, which allows users to visually process and digest information faster, and there is a single encompassing title. I suspect if you were to test placing a well-designed CTA above the fold within this new page, you might find no difference between that and your original Variant – this would imply that the main fault of the Control was not the placement of the CTA but the page content itself, and that this is what you have corrected. Performing a before and after comparison of page dwell times and exit rates would lend further visibility.
All in all, this test is a good foray into the unknown, and an interesting challenge to the general thinking on orientation around the page fold, but rarely can such any single dramatic redesign prove beyond doubt the fallibility of such a fundamental tenet of design and optimisation standards – it simply provides a signpost for further exploration.
Hi Ollie – Thanks for your comment!
Yes, there are certainly other things that have been changed on the page – I also made a point out of mentioning this fact in the case study. Nevertheless, the fact remains that the variant with the CTA at the very bottom of the page outperformed the control version with the CTA at the very top of the page significantly – something that should not be possible if you subscribe to the Best Practice Rule that above the fold CTA is always better. That’s the main point of the case study.
As for your point that the control is “extremely text heavy”; there is exactly the same amount of copy on both variants, and the copy is identical on both variants – the only difference is the font size of the header and sub-header (It’s smaller in the Control).
Moreover, I’ve conducted several other tests since then where variations with the CTA below the fold have outperformed variations with the CTA above the fold.
I’ve also conducted several tests where variations with the CTA above the fold have outperformed variations with the CTA below the fold. So – just to make it clear – I’m by no means saying that the CTA should always be under the fold (that would be stupid). What I’m suggesting is – like I state in the article – the optimal placement of the CTA depends on the product being sold, and the motivation of the prospects – and not a standardized “cookie-cutter” rule of design best practice
Again thanks for you insights – I appreciate you taking the time to interact!
- Michael
It’s really a cool and useful piece of info. I am happy that you simply shared this helpful info with us. Please stay us informed like this. Thanks for sharing.
ZeeBizuk.com recently posted..1
Hello Michael,
Like yourself I am a great believer in testing then testing again and again. In fact I do not stop testing on any individual item that can affect website traffic or sales. Over a long time I have discovered that placing calls to action in positions that are not generally recommended sometimes give results like you mention. I have also found repeating the same call to action in two places on some pages is also a winner.
Toby.
Toby Carlisle recently posted..Practical Learning Benefits