Optimize the above-the-fold section

Contributors

@andreea-macoveiciuc-content-expert


Business Benefits

Improve your above-the-fold section and encourage users to scroll.


Place your most compelling content above the fold to set the stage for future content and provide quality expectations.

Ask yourself What makes your product or service interesting and valuable? to determine what content should go above the fold.

The above-the-fold section is the content that displays on a site without requiring the visitor to scroll.

For example, Google released a study that found that, with viewability defined as 50% of the ad’s pixels being on-screen for one second, ads just above the fold had 73% viewability, whereas ads just below the fold only had 44% viewability.

Position your call to action above the fold when you have a clear and simple value proposition.

The content above the fold has two tasks; clearly explain the value proposition and signal that there is more valuable content below the fold.

Use subtle design and text directional cues, to encourage your visitors to scroll below the fold and avoid a false bottom.

To encourage visitors to scroll, here’s what you can do:

  • Craft compelling content, value propositions, and landing pages.
  • Avoid false bottoms.
  • Ask them to scroll with directional cues.

A false bottom makes it seem as though there is no other information on the page.

Tailor the location of your call to action to your type of visitor for example, certain visitors or uncertain visitors.

  • Certain visitors: Visitors that are familiar with your brand, they know what you offer, and they know it solves a problem they have, are going to convert. Therefore, you do not have to hide your call to action and can place it above the fold.

  • Uncertain visitors: Visitors that are not familiar with your brand, product, or service, are not convinced that it is the best solution to their problem yet. However, if your value proposition is simple, you can still place it above the fold.

For example, if you have uncertain visitors and your value proposition is complicated, you may need to provide more information. Place your call to action below the fold so that your visitors have time to get more information before seeing the CTA.

Use Google Analytics to find out the screen resolutions your visitors use most often and then design for those resolutions.

Open Google Analytics, and within Audience, select Technology, then Browser & OS. Below the graph you will see Primary Dimensions. Select Screen Resolution.

Position your fold at 600-700 pixels as a guideline.

Each device has a unique screen size and resolution, meaning a unique fold position. View your site in multiple resolutions by opening a Chrome window, right-click, and select Inspect. Next, click the device icon in the top, left-hand corner of the Inspect window. Then, choose a custom screen resolution or select a specific device from the dropdown menu.

Test different call to action positions and test different content above the fold.

This will help you determine what is best for your audience.