Have you heard of the terms Above the Fold and Below the Fold?
Above the fold is a concept that needs understanding more than anything else. More so, it’s essential when you are designing a website or planning your navigation to provide an enhanced user experience.
What Is Above The Fold?
Above the fold is a part of the web page you notice as soon as you land on a website. It’s the part of the web page that you see without having to scroll down. Crafting the perfect ‘Above the fold’ content can inspire users to take necessary actions, such as navigating further, signing up, and doing more.
If you thought the concept of above the fold is new, well, you’ll be surprised to know that it dates centuries back.
Have you seen how newspapers are displayed on a newsstand? I’m guessing it’s folded once with the top half of the newspaper visible to you.
Did any headline catch your attention? Which eventually got you to pick up/ purchase the daily.
This is precisely the concept behind digital content.
To read more in a newspaper, you open the fold. Similarly, on a website, you scroll to read more.
While the content you see immediately on a web page is referred to as above the fold, the part of the content that requires scrolling is considered below the fold.
Importance Of Above The Fold
Guess it’s pretty evident that what gets seen first gets the maximum click-throughs.
A study also shows that ads that appear above the fold have 73% visibility compared to 44% visibility to those that appear below.
While the importance of above the fold in designing a website or landing page is pretty essential, it’s not as important as it was back in the ’90s.
Owing to slow internet speeds and the time taken for websites to load, there were fewer chances of users going beyond the top half of the web page.
User habits have indeed changed enormously, and with faster internet connections today, it’s way simpler to use your mouse scroll wheel to navigate below the fold.
This has led to far less cramming of the information above the fold.
Today, you’ve got a lot more elegant and minimalist designs that probably have a simple mission statement and a straightforward CTA.
Most of the attention will be focussed above the fold, which doesn’t mean you flood this area with all your CTAs and ads.
Google algorithms can even penalize this practice severely, thereby ruining your website’s ranking.
Not to mention, pushing all those important information below the fold can annoy your website visitors and create a not-so-good user experience.
Above the Fold Best Practices
Now, there are no hard and fast rules when it comes to the best practices for an above the fold placement. These best practices can serve more as helpful guidelines.
These are common-sense ideas ensuring that the most engaging content is above the fold.
One such best practice is ensuring your web page’s above the fold fits nicely on a 1,024 by 768-pixel screen size.
I’m assuming that most screen sizes are more significant these days. So, adjusting your web page to fit this minimum screen (1,024 by 768-pixel) size is essential.
Have you come across those websites that don’t have a below the fold? They either have a CTA, menu links, or a horizontal scroll that helps navigate to the inner pages.
Such innovative designs are pleasing to the eye and fit all screen sizes.
Call To Action (CTA): Above or Below the Fold?
As website owners, we all want our visitors to take action. Be it a free sign-up, download an ebook, make a purchase, subscribe to our newsletter, and do more.
Does this mean that we have our CTA displayed right upfront, i.e., above the fold?
Well, this is not that simple.
You’ve got to consider several factors before placing your CTA. And it all boils down to at what stage of the customer’s journey is your website visitor at.
Heard of the AIDA model? Awareness > Interest > Desire > Action.
You’d agree that not all your website visitors are the same.
Some visit with an obvious intention of purchasing, while others may be at an information-gathering stage. Some may also be sitting on the fence and need that extra push to go ahead.
For instance, there’s no point showing educational content to a website visitor who’s come with the sole intention to buy. Such customers need to be shown a ‘buy now’ CTA.
On the flip side, if a visitor has come in to gain more information regarding the product or service, however attractive your CTA is, there are fewer chances they’d take action.
Making an informed decision on where to display your CTA is oh so important when designing your web pages (and landing pages).
Examples of Above the Fold
While there is a lot of great above the fold content around, here are a few examples to inspire you.
Shopify
The Shopify homepage includes the bare essentials to lure prospects into taking action. They alternate between images and videos that make a lasting impression. The tagline compels visitors to click that green CTA to start a free trial with a bare minimum copy.
Wix
As simple as it gets! Wix helps you get started with creating your own website. And that’s all they communicate on their homepage with a CTA that inspires you to just do it.
Ahrefs
An unambiguous and precise mission statement to help you gain more traffic and rank higher on search engines. Along with a trial period CTA, Ahrefs keeps it as simple as possible yet highly effective.
