The fold is the lowermost, horizontal edge of the page where the content is cut off so that a user has to scroll to see more. Human readers and search engine robots alike examine content above the fold to understand the focus and goal of a particular page.
How you design content is important for helping people and search engines understand what everything on your store does and what it means. The ways that webmasters organize the information on a page are often unseen, resulting in attractive, easy-to-understand words and images that just flow.
To understand why the fold of a website is so important, let’s think back to the most authoritative and widely consumed content of the 20th century: the newspaper.
Newspapers for sale in machines were folded in half, with the top half of the front page on display. This web design term originates from the fold of the newspaper. When most people got their news by reading it in the newspaper, the most important information that the reader latched onto right away was the headline. An enticing headline would encourage passersby on busy city streets to purchase a copy of the day’s newspaper. Back then, being up-to-date on current events meant purchasing copies of the newspaper from a machine or having a subscription delivered to the front door. Today, several web design elements work together above the fold to entice visitors to consume and engage with the content on any given page.
Which content should you put above the fold?
As you might know, on-page content helps your visitors as well as the search engine understand what each page of your website is all about. You may not think of yourself as a web designer, but deciding the best place on the page for each image, link and text block are all design choices.
Deciding where to put each piece of content on each page depends in part on the page’s purpose. Therefore, you’ll design a product page differently than you would a blog post. As with many important considerations in SEO, the answer depends on the use case. Let’s take a look at a few different types of content.
One universal design element that is sure to make your content more engaging is to place a clear, attractive image above the fold. By placing an attractive, on-brand image toward the top of the page, you help shoppers and readers understand the focus of the page instantly. In your slide show, this can be your latest product, a vivid graphic to advertise your latest promotion, or a curated photo of products that customers love buying together.
Heading tags, or H tags, refer to HTML text that is used by readers and the search engine to understand the primary focus of a given webpage. Each page should have one H1 tag, which contains a key phrase that describes the content of the page.The H1 tag can go above or below the fold, depending on the purpose of the page (we’ll explore this more in a moment). Either way, it’s best practice to place your H1 tag above the body copy.
There are a few elements that almost everyone expects to see right away when they land on a webpage for a specific product. Whether your target customer is an individual or a business, having a high-quality image above the fold is important. You’ll also have the product’s name readily visible.
On most platforms, there are a couple of different fields you can fill out with content to describe the products found on each category page. Content in the category description field will go above your products. If your customers will have questions about which product to choose, it’s wise to use the category description to include some keyword-rich content that provides more information about the products in the category, as well as links to related categories.
Let’s say your store sells jewelry, and you have bracelets available in white gold and silver. If a shopper lands on the Silver Bracelets category page, but wants to see if certain styles also come in white gold, you can include a link to the White Gold Bracelets category page. Including relevant links above the fold helps the shopper explore related pages, but there are other SEO benefits, as well. This strategy can also decrease your bounce rate and improve your session duration (we’ll go into this more in the next section).
You can also use the secondary description field, below the products. Deciding whether to use this field, the category description field, or both depends in part on how well your users already understand your products. For example, someone who is buying a replacement part for their faucet probably has more questions than someone who is buying a T-shirt. If your products are more visual, such as designer clothing, consider putting your keyword-rich, category-level content below the fold.
Now, including relevant internal links in this content is still important for shoppers and the search engine. But those links may not get as much attention from your visitors, if they start shopping the products above the fold, first. This is not a bad thing; it just means that if you need to answer questions in your content, perhaps the category description field is the place to do that.
Call to Action
The type of call to action (CTA( button you use, and where it belongs on the page, depends on the type of page. For a product, the CTA is generally above the fold, so customers can purchase easily. When writing a blog post, you’re more likely to have one or more CTAs below the fold, at a scroll depth of at least 50% (that’s web design speak for “when the user has looked at the top half of all of the content on the page”). A common CTA for blog posts is the comment field. If your blog post includes links to products, each product link is a CTA as well.
Optimizing Above and Below the Fold Content
As an ecommerce founder, your conversions and your overall user experience (UX) depend on placing your best and most engaging content in strategic places on all of your webpages. How do you make those decisions without going through a lengthy and costly trial and error process?
Use Google Analytics, Search Console Data to Guide Content Optimizations
You can get an idea of how well your readers and shoppers are engaging with your content by looking at a couple of important metrics. If you have had Google Analytics and Google Search Console installed on your site for a couple of months, and you have had some traffic to your store, you already have everything you need to get started.
Using Google Analytics, it is possible to see the percentage of your visitors who landed on your site and visited only one page without taking any further action on your site. This number is known as the bounce rate, and it is expressed as a percentage. What makes a bounce rate “good” or “bad” depends on a number of things, but if it is above 60% for users in your target geographical areas, making some changes to your content above the fold is worth a try.
Another useful metric offered by Google Analytics is session duration, or how long users spend on your site. If your visitors are generally spending only a few seconds on a high-value page, this could be a sign that it’s time to make some adjustments.
How will you know which optimizations to prioritize? Google Search Console offers valuable insight into how the search engine’s robot is interacting with your site.
Let’s say you have included a big, eye-catching photo of your latest product above the fold. The photo looks great, when you load up your homepage on your desktop! It’s crisp and clean, with striking details. So why is the bounce rate so high? Perhaps you’re hosting that image in a folder on a third-party website, and the file is too large. In that case, you might want to search for an image compressing tool so you can show off your product in detail, without increasing the time it takes for a mobile user to view the complete page on their phone.
There are many ways to use Analytics and Search Console data to assess how your content is performing. If you see a major dip in traffic to an important page, definitely look at all the data you have!