Excellent CTA Placement: Above-The-Fold Vs. Under-The-Fold

As an internet site designer, your skilled life revolves round essential questions that may enable you to ship higher outcomes on your shoppers.

Which widgets are important to driving conversions? What sort of checkout web page parts do that you must embrace? Ought to there be a video or slideshow on that product page?

One of many greatest queries that we face when constructing touchdown pages to encourage gross sales is whether or not a CTA (name to motion) button must be above or beneath the fold. 

Answering the query: “The place ought to the CTA go?” accurately may make or break your consumer’s possibilities of a sale. Sadly, this specific concern has been the supply of a raging debate for a few years now. Everybody has their very own opinion about CTAs and the place they belong.

Right this moment, we’re going to cowl the advantages and points with inserting a CTA above the fold.

Ought to You Place a CTA Above the Fold? 

Beginning with a fast refresher, the time period “above the fold” refers to any space of an internet site seen on a display when a consumer arrives on a webpage. The content material that seems above and beneath the fold could differ relying on the machine you’re visiting an internet site with. 

Specialists within the design and digital advertising and marketing world have steadily claimed that if you wish to get the best results with a CTA, that you must place it above the fold. 

This technique makes a number of sense. In case your CTA is above the fold, then your possibilities of it being seen are considerably greater. Some clients won’t need to scroll to the underside of a web page to search out out what they should do subsequent of their purchaser journey. 

Moreover, according to the NN group, the 100 pixels that appeared above the fold have been seen 102% extra usually than the pixels beneath the fold. Eye-tracking expertise realized that most of the time, you’ll get extra engagement above the fold. 

Simply take a look at this touchdown web page from Lyft, for example, you instantly see what that you must do subsequent:

It’s not only a single research that has touted the advantages of an above-the-fold CTA, both. 

One other report into the “significance of being seen” discovered that above-the-fold adverts and CTAs had a 73% charge of visibility in comparison with solely 44% for those below the fold

So, with stats like that to consider, why would you ever think about using a below-the-fold CTA? 

When to Place a CTA Under the Fold

As with most issues in net design, there’s an exception to the rule. 

Sure, above the fold, CTAs might be higher for you more often than not. Nonetheless, there are occasions if you would possibly have to suppose outdoors of the field. 

Most individuals suppose that inserting a CTA beneath the fold virtually ensures that it gained’t be seen. Nonetheless, when you’re creating an internet site web page or touchdown web page that features a number of important info, your viewers might want to scroll. 

As an illustration, when you’re making a web page the place somebody can obtain an app to have interaction with a enterprise they already find out about, it is sensible to hurry the journey together with an above-the-fold CTA. Nonetheless, when you’re attempting to persuade somebody to join your webinar, you would possibly want to inform them what that webinar is all about first. That’s the place a below-the-fold CTA is useful. 

Prospects won’t have a number of time of their busy schedules for scrolling as of late. Nonetheless, they nonetheless want the proper info earlier than they will decide about what to do subsequent together with your model. In response to Advertising and marketing Experiments, below the fold, CTA buttons may end up in a 20% enhance in conversions. Nonetheless, this conversion increase solely occurs if you’re offering helpful, participating, and persuasive content material.

Try this instance from the Boston Globe, for example:

The Fold Isn’t Every part in Net Design

The fold is commonly a necessary consideration in net design. 

Nonetheless, it’s not all that you must take into consideration if you’re deciding the place to position sign-up kinds and helpful CTA buttons. 

In accordance to the Nielsen Norman group, the content material that seems on the high of the web page will all the time affect consumer expertise. Nonetheless, that doesn’t imply that that you must place your CTA there. What you do have to do is be certain that no matter you’ve above the fold is promising sufficient to have interaction your customer and make them scroll. 

Put merely, what’s above and beneath the fold does matter, however your focus needs to be on making the most of buyer motivation, moderately than worrying completely about an imaginary line. 

When deciding the place a CTA belongs, that you must take into consideration motivation. 

How motivated is your prospect to click on on a button? How fascinating is your providing at the moment, and the way a lot does your customer already know concerning the factor they’re being provided?

When you’re going to want to supply extra info earlier than your buyer needs to transform, then a below-the-fold CTA makes extra sense. 

When you’ve already offered all the data that your buyer wants and a prospect is visiting from an commercial or one other web page on the web site, then above the fold needs to be distinctive. 

The Reality About Designing for The Fold

The fact for net designers at present is that reaching greater conversion charges doesn’t actually have that a lot to do with whether a CTA is above or beneath the fold.

What’s essential is whether or not your buttons come underneath the correct amount of copy that solutions the right questions for an viewers. 

Keep in mind, when guests come to an internet site, they’re on the lookout for various things. There are guests that:

  • Already know your model and worth your providing: These persons are usually clicking into your touchdown pages from different advertising and marketing campaigns the place they’ve realized concerning the model or supply. You can provide these prospects a CTA instantly to allow them to proceed down the client’s funnel as quick as potential. 
  • Are unsure about your providing and have to know a bit extra: These folks want some additional info. They may have a priority that must be addressed earlier than they’re prepared to spend their cash. You won’t want a lot copy right here, which signifies that a CTA should still seem above the fold. 
  • Are model new to your web site: These prospects want an inexpensive quantity of copy. They don’t know what you’re providing or why it’s helpful to them. Due to this, it’s possible you’ll want to attend to push them into motion till you’ve delivered the proper copy. 

In some circumstances, it’s possible you’ll even place a number of CTAs on the identical web page. Some folks can have a normal understanding of the expertise and what it does. Which means that they’ll be completely satisfied to click on on the button on the high of the fold. 

However, there is also guests arriving on the identical web page that don’t perceive what the advantages of real-time personalization are. Which means that that you must elaborate just a little on what it’s a must to supply. A easy one-line rationalization isn’t sufficient right here.  

Figuring Out The place to Place a CTA

Deciding the place to position completely different parts of an internet site is a standard problem for net designers. Regardless of tons of blogs on the market, that declare “above the fold” is all the time the most suitable choice for any conversion charge optimization, the reality is a bit more difficult. 

The important factor to recollect as an internet designer is that a CTA button asks a buyer for dedication. Even when the CTA permits somebody to obtain a free demo or sign-up for a e-newsletter with out spending any cash, it requires a buyer to begin a relationship with a model. 

In a world the place clients are much less trusting of corporations than ever, it doesn’t make sense to push them right into a relationship too shortly. Asking for a dedication from a target market earlier than they’ve had the possibility to see what’s “in it for them” is just not a good suggestion. 

Soar in too shortly, and also you’re prone to rub folks the fallacious approach. 

Go Out and Grasp the Fold

The difficulty for at present’s designers isn’t determining whether or not a button must be seen from the second somebody arrives on a web page. As a substitute, that you must take into consideration whether or not guests are discovering the CTA at a time after they’re able to take motion. 

You may solely reply the query “the place ought to the CTA go?” after you’ve rigorously analyzed the challenge that you just’re engaged on. 

Keep in mind, above the fold isn’t all the time the reply. 


Featured picture via Pexels.


The put up Perfect CTA Placement: Above-The-Fold Vs. Below-The-Fold first appeared on Webdesigner Depot.

Select your currency