Have you ever heard of the phrase “above the fold” in reference to the design or layout of a website? In this context, “above the fold” refers to the portion of the web page that is immediately visible to visitors (without scrolling) when they first land on the site. The actual dimensions of the area above the fold depend on the screen size of the device on which a user is viewing your website.
The term is derived from the newspaper industry. When newspapers were displayed on storefronts, people would only get to see the top half of the front page (“above the fold”) before making a decision about whether to purchase the paper. Because of this, editors wanted to make sure the most enticing and post important headlines and pictures were placed there so consumers would be more likely to buy the paper.
While websites and newspapers are certainly not the same form of media, the logic behind the fold in newspapers can be applied to the fold on your website.
Entice, Don’t Overwhelm
When deciding what to place above the fold of the website, sometimes designers or decision-makers fall into the trap of trying to cram as much information as possible to make sure the reader looks at it. Remember that just because you look at something, that does not mean you always see it and process it. You don’t want your visitor to be met with so much information and calls-to-action (CTAs) right away that he or she does not end up processing anything. It’s better to keep items more spread out. Your business may have a lot of great products to showcase and offers to make, but you have to decide on one or two best ideas or pieces that you want visitors to see first.
Much like the headlines above the fold of newspapers were, in part, meant to entice readers to buy, the information above the fold of your website should entice your visitors to read more. Don’t feel obligated to list a complete overview of your company right away. Find the most appealing aspects of your company and share just enough content (written or graphical) to get the viewer to want to learn more about your products and services.
CTAs are an important part of your website, and you obviously want specific ones to be displayed prominently to your visitors. There is some debate as to whether it is better place a call to action above or below the fold, but really it’s best to find out what works best for your site. If you can, either on your homepage or certain landing pages, A-B test different spots for your CTAs and see whether they perform better above or below the fold.
The type of CTAs you have should also have an impact on where you decide to place them. If your CTA is something that will not require the user to provide information—such as a button that says “Shop Now” or “View Our Products”—then that is a good candidate for one to be featured prominently above the fold. If your CTA directs users to a form where they have to provide contact information, you may not want that featured above the fold. Remember that the information you are placing there is meant to entice visitors to read and learn more about your company. They may want to learn more before they are ready to fill out a form and provide you with personal information.
Responsive Design and Mobile Devices
When making decisions about what to place above the fold, it is important to think of the area in terms of different devices. If users are visiting your site on smartphone or a tablet, you may only want to prominently feature one idea, content piece or action item above the fold; whereas on a desktop, there may be room for two or more. Don’t forget to consider both the width and height of devices when making decisions about the kind of content to prominently feature. Also, if you are going to feature CTAs for visitors on mobile devices, make sure the pages they are directed to or any forms or menus are mobile friendly.
How do you decide what information to place above the fold on your website? What are some of your best practices for enticing visitors to read more? Share your experiences with us in the comments below.