We've often heard from our clients that they want more content "above the fold." We interpret this to mean: "on my computer I want to see certain content without having to scroll."
But as a web design concept, the fold means less than it ever did— given the increased variety of devices and screen sizes in common use.
In a newspaper, the fold is in the middle of the page. Online, where exactly is the fold? It varies according to screen resolution. These two charts (based on actual visits to our site) show how complex the answer truly is.
Back in 2007 (left), 36% of all visitors to our site had screen resolution of 1024 x 768. The top ten resolutions accounted for 93.6% of all visits.
By 2013 (right), the largest share was 1920 x 1080 at 14.4%. The top ten accounted for only 83.4% and the distribution was much more evenly spread. Almost 17% of visitors had a resolution outside the top ten.
Here's an amusing little animation showing the changes over a six-year period.
Today the fold is no more real than the Minotaur. But creating a good first impression is as important as ever. If the top of the page is clear and engaging, people will scroll to see content below. Good design and targeted content work together to lead visitors to take action, even if that first action is scrolling.
Google Analytics offers a Browser Size Analysis tool to help you think about screen real estate in a more nuanced way. Once you're logged in, go to Content > In-Page Analytics. You can click anywhere on the screen to find out what percentage of visitors can see that point, or control the threshold percentage by using the slider. The screenshot below indicates 97% of visitors can see the important "Try the demo" button without scrolling.
Let's work together
Tell us about your project and we'll get back to you shortly.
Join The Conversation
More On The Blog
Critical Mistakes To Avoid When Migrating To Shopify
With more than one million businesses currently using Shopify as their preferred eCommerce platform, it’s normal for other online businesses to consider Shopify migrations. Still, re-platforming can be costly (see how much it costs to perform an eCommerce platform migration) and a lot of things can go south if your team is not prepared.
Sol Dieguez — Jun 22, 2022
Is Django better than Ruby on Rails? Django vs Ruby on Rails Comparison
Right now, two of the most popular full-stack web frameworks are Django and Ruby on Rails. These two platforms have similarities, but they’re also quite different when it comes to the details that can make or break a development project.
Sol Dieguez — Jun 15, 2022
How Ruby On Rails SEO improves your eCommerce Google rankings
You might not be familiar with is how Ruby On Rails SEO improves your eCommerce Google rankings. Keep reading to learn the importance of Ruby On Rails SEO and its best practices!
Sol Dieguez — Jun 4, 2022