Above the fold

When crafting the perfect page for your Shopify store, you may have come across the terms “Above the fold” and “Below the fold”. To clarify what these terms means and what design elements you should include in each of these website sections, read on. 

In this article, we’ll dive into: 

• What is Above the Fold versus Below the Fold? 

• What Content Should Live Above the Fold?

• What Content Should Live Below the Fold?

What is Above the Fold Versus Below the Fold?

When designing landing pages for your Shopify store, you'll often hear the terms "above the fold" and "below the fold." 

These terms refer to:

• Above the fold: the portion of the page that is visible to users without having to scroll down 

• Below the fold: the portion of the page that is visible only after scrolling down (below the fold)

What Should Be Above the Fold? 

The above the fold section of your landing page is arguably the most important real estate on your website. It's the first thing your visitors will see when they land on your page, and it needs to grab their attention right away. This section should contain your most important message, such as a headline that clearly communicates the value of your product or service.

When building your homepage or landing page for your Shopify store, consider including the following elements above the fold content: 

• Clear and attention-grabbing headline communicating your USP

• Supporting subheadline to back-up your headline/provide more context

• High-quality hero image or videos that showcase your products or brand

• Navigation menu to make visitor site exploration as easy as possible 

• Call-to-action button to encourage visitors to take a specific action, such as "Shop Now" or "Add to Cart”

• Product categories or featured products so visitors quickly find what they’re looking for

• Limited-time offers or promotions that create a sense of urgency 

It's important to note that what appears above the fold can vary depending on the device being used to view your page. For example, a desktop computer will display more content above the fold than a mobile device. This means you need to carefully consider the layout of your page to ensure that the most important information is visible on all devices. A/B testing can also help you to establish which variations above the fold elements result in more conversions. 

What Should Be Below the Fold? 

Below the fold is the section of your landing page that users will only see after scrolling down. While this section is still important, it's not as critical as the above the fold section. This is where you can provide more detailed information about your product or service, such as features and benefits.

Here is a list of content that can be placed below the fold on a Shopify homepage:

• Additional product categories to help customers easily navigate 

• Best sellers or featured products to entice customers to continue browsing 

• Social proof such as customer reviews or ratings to build trust and credibility 

• About Us section to tell your brand story and give customers a better understanding of your company values and mission

• Trust badges reassure customers about their purchases

• Contact information makes it easy for customers to contact you 

• Blog posts give customers more information about your brand or industry

• Related products help customers make informed purchase decisions

• FAQs address common concerns or issues customers may have

It's important to strike a balance between the above the fold and below the fold sections of your landing page. You want to provide enough information above the fold to grab users' attention and encourage them to take action, but you also want to provide enough information below the fold to keep them engaged and interested in your product or service.

In Conclusion 

In a nutshell, understanding the difference between above the fold and below the fold on landing pages is crucial to creating an effective website. By carefully considering the layout of your page and strategically placing your most important information, you can create a landing page that effectively communicates the value of your product or service and encourages users to take action.