You’ve probably heard the phrase “above the fold” before. This term comes from the newspaper industry and refers to the content that is visible when the paper is folded. This is where the day’s most important, attention-grabbing headlines, stories, and pictures are placed. In this article, I’ll be discussing what the term means as it pertains to above the fold website design.
What is “The Fold” In Web Design?
In web design, above the fold refers to the content that is visible when a web page is loaded, before the user scrolls down. A more literal description for the term in web design would be “above the bottom of the screen.”
Web designers today have more to consider when it comes to what is visible than in the past. When websites were exclusively accessed on computers, the fold was more measurable because screen sizes didn’t fluctuate too drastically. Now, a page’s “fold” will change depending on the size and orientation of the device that it is being viewed on.
Above the Fold Website Content
Just like with newspapers, the content that goes above the fold on a website is the most important information. Anything that you want everyone who visits that page to see should be above the fold website content.
If your website contains a main CTA (call to action), it is important to include this above the fold. For example, let’s say you have a non-profit organization and the main goal of your site is to drive donations. The homepage of your website is probably not the same page as the donation page. This is because people need to be able to learn about your organization before being confronted with a donation form. This is where a CTA comes in.
A CTA directs visitors to take actions to achieve desired results. You want the “Donate to Our Charity” CTA to be above the fold because it is important that your site’s visitors see it and know that they can donate by clicking there. If they have to scroll beyond where they are when the page loads, you may be missing out on donations, volunteers, or whatever the main goal of you site happens to be.
So, Should I Just Put Everything Above the Fold?
NO! Having said that, I’ll provide a more in-depth explanation. The area above the fold is not just for CTAs of course. It is for anything that you want your visitors to see, without having to scroll. Because this is the content that everyone will see, you want the highest priority content to get more attention. That is not possible if you are just trying to fit everything that you can above the fold.
In recent years, people have begun to understand that less is more when it comes to above the fold website content impacting site visitors. Many sites took it back to basics and we saw the emergence of full-width (or full page) images with minimal text and simple, minimalistic CTAs. By giving visitors fewer things to look at above the fold, they were increasing the impact of these few elements that were above the fold.
I hope this has given you a better understanding of the concept of “above the fold” and above the fold website design principles.