Above the Fold

Definition

What does above the fold mean?

The term above the fold refers to the part of a web page that the user sees first before they scroll down. As a general rule, it is good practice to put your most engaging (or important) content in this section to either ensure that the user would want to explore the rest of the page or get the information they need before they click off.

If you wish to learn more about this topic, check out the FAQ section below:

Question #1: What is the difference between above the fold and below the fold

The main difference between above the fold and below the fold is where they are located on a web page. As their names suggest, this section is the one the user sees before scrolling down, while the section below the fold is everything that is revealed upon scrolling down.

The goal is to make the content you put so engaging and intriguing that the user would want to see what is below the fold and on the rest of your website.

Question #2: What content should I put above the fold?

While there are no hard and fast rules as to what content you should put this fold, it is a good idea to use it to clearly answer the number one question in the user’s mind: what’s in it for me? This means you need to immediately let the user know that you know exactly what they are struggling with and have the means to make it go away.

A great way to do this is through a powerful headline and supporting subheading and visuals.

Now, if there is space left, you can also sneak in a partial preview of the section below the fold to make the user want to keep scrolling.

Question #3: What is a false bottom?

Speaking of making the user want to keep scrolling, a false bottom refers to an above-the-fold layout that does not make it immediately clear that there is content below the fold. Keep in mind that no matter how engaging and intriguing you make the content you put it, if the user does not know that they should scroll down to see more, there is a big chance that they would not.

So, how exactly do you do this? Here are a couple of methods you can try:

  • Use copy and visuals that suggest that the web page continues below the fold
  • Sneak in a preview of the section below the fold above the fold
  • Tell the user directly (e.g., find out more below)

Question #4: Should I put my calls to action (CTAs) above the fold?

While it is definitely a good idea to put your calls to action (CTAs) above the fold, that is not the only place you should put them in.

We will not go into much detail because this is more of a UI/UX design topic, but as a general rule, you would want to strategically place your CTAs throughout each page so the user does not have to come back to the top of the page just to click it. The goal is to make the whole conversion process as frictionless as possible for them.

Question #5: Is it still relevant today?

It is still relevant today in the sense that it is still a good idea to put your most important, engaging, and intriguing content up front.

Figuring out where it is, however, has become a bit trickier, thanks to the advent of different screen sizes and orientations on modern devices. Fortunately, there are tools you can use to check how your web pages—which are now also so much more responsive—look on different devices prior to publishing.