Above the fold content is what appears on the screen of a given device when a web page loads before the user scrolls.
We’re going to quickly get to the bottom line of why understanding above the fold content is so important for your web page’s SEO.
What shows before scrolling
What shows before scrolling on a web page is very important because Google and other search engines put a ‘higher value’ on this content than what is shown below.
Yes. There are 400+ SEO ranking factors and this is just another small piece of the puzzle. Don’t get stuck on this one! It’s just important to understand every little optimization adds up to a well-optimized website!
But, why not take advantage of this easy win when optimizing your web pages for SEO.
The mobile version is what matters!
Google began mobile-first indexing in 2018. Yes, 2018.
That means they are really only counting what comes ‘above the fold’ on a mobile device! Think about that. You better construct your web pages properly to not lose out on the benefit of this easy SEO optimization.
Above the fold content should include 4 things
Let’s discuss what optimization to make really quick.
Here’s my go-to plan of action when it comes to optimizing for this SEO tactic. It’s pretty freaking simple really.
The 4 above the fold content optimizations:
- H1 tag – hopefully, that 1 was obvious!
- Keywords in paragraph key specific to that web page (should reflect the H1 and URL slug of this page too…)
- An image with a keyword-friendly file name and alt tag. It should also be compressed or other-wise optimized for speed such as being an SVG or .webp file type.
- A call to action (CTA) of some sort…could be a button, link, or contact/opt-in form.
If you have room to fit more, do it. The next logical thing to include would be a keyword variant of your H1 tag using the H2 tag and keyword-rich text in the paragraph text below it.
Above the fold varies!
The most important thing to understand about how search engines determine ‘what is above the fold’ and ‘what is not’ because it varies!
Are you confused? Don’t be. It’s pretty simple really.
Different devices have different screen sizes. So naturally, a different amount of content is going to show ‘above the fold’ depending on which specific device you are viewing that web page on.
It varies a lot!
Just to reiterate this point, what shows above the fold varies a lot and I’m not just talking on a computer, tablet, and phone.
What shows above the fold will vary from device to device even if they are the same device type!
Are you confused? I’ll explain.
All phones do not have the same screen size! The same goes for computers and tablets. We haven’t even mentioned ‘laptops’ yet!
The difference between viewing a web page on an iPhone 6 and an iPhone 12 is going to be pretty vast. The iPhone 12 will have 1-1.5″ more content showing.
There’s more to screen sizes
One of my upcoming blogs will be discussing optimizing web page content for all screen sizes. I’ve already touched on optimizing text for various screen sizes, but we need to make sure our images, videos, and everything else, containers, rows, etc. are also responsive.
A rookie mistake I was guilty of myself was optimizing the websites I was building back in the day for my computer screen and my mobile device. 99% of people aren’t viewing the web on my device types and screen sizes though!