Let Go of the Mythic Website Fold
No matter how unfamiliar people are with web development, one concept is universally known: The Fold. I don’t ever bring it up, and yet it rears its ugly head at the start of nearly every web design project.
Check out this excerpt from a keenly written blog post, Life Below 600px:
Imagine a newspaper squashed all of its quality content on the front page. How disappointed would you be to open the paper to only find the leftovers? The same happens with your site. If everything of exceptional quality is pushed upon the reader at the beginning, once they start exploring and the rest of the site isn’t of the same calibre, they’re going to be let down.
I’m going to let you in on a change in your behavior that you’re probably not even aware of. You have evolved as a web surfer in the past few years. You don’t just look for information in the top half of a website; you scroll. You scroll more now than you have ever before. And it’s because the mythical fold is irrelevant.
It used to be that pretty much everyone had their computers’ screen sizes set to 800×600. So when standards in web design were developed, the fold (modeled off the fold in a newspaper) was said to be 600 pixels down the screen. If you wanted your audience to see anything on your website, you had to cram it into the top of the site. If a user scrolled down through these top-heavy messes, they would find little to no important information. And since people weren’t finding anything relevant in the lower portions of websites, they stopped scrolling, and the myth of the fold persisted.
Think about the difference between how people view the Internet now and how they did 15 years ago. They no longer view it using their trusty square-shaped monitors. They use tablets, smart phones, laptops, desktops, all with different screen sizes, all rectangular. And since people have gotten more computer savvy, most know they can get more real estate on their screens by changing the resolution.
My screen’s resolution is 1680×1050, which means that a website that is 1050 pixels high is easily viewable on my screen without even scrolling. That’s almost twice where the mythical fold is supposed to be. Your display might be set to 1024×768 or any of about 20 other possibilities, but it’s highly unlikely that it’s 800×600.
So the fold wants to die. Quietly. Modestly. It wants to bow out of my world as a web designer and – guess what? – your world as a website viewer.
If the newspaper doesn’t grab my attention in the top of the fold that shows in the vending machine window, I won’t put my coins in. If a website makes me scroll to get interested, I’ll leave.
Most smartphones only show 480×800 resolution, and usually the web is browsed on these with the longest resolution horizontal, since side scrolling is such a pain.
Netbooks are famous for only showing part height, and they are among the fastest growing sectors. Below is from http://appdeveloper.intel.com/en-us/article/validation-guidelines:
Platform/Device/Manufacturer Display size Display Resolution Video Chipset
Netbook – Aspire/Acer 8.9 WSVGA 1024×600 GMA 950
Netbook – EE900/Asus 8.9 WSVGA 1024×600 GMA 950
Netbook – EE1000/Asus 10.2 WSVGA 1024×600 945 GME
Netbook – Pico/Axioo 10 WSVGA 1024×600 945 GME
Netbook – Mini/Dell 8.9 WSVGA 1024×600 GMA 950
Netbook – Mini/Dell 10 WSVGA 1024×600 GMA 500
Netbook – Mini/Dell 12.1 WSVGA 1024×600 GMA 500
Netbook – P-series/Sony 8 1600×768 GMA 500
Netbook – Mini/HP 10.1 1024×576 GMA 950
Netbook – Inventec 7 1024×600 GMA 950
Thanks for the comment, Steve. It’s an interesting perspective.
While I certainly agree that there should be worthwhile content above that 600 pixel line (really, there should be worthwhile content in every square inch of the page!), the antiquated trend of pushing anything at all “worthwhile” up to that section of the page is what many developers like myself are opposed to. If structured properly, a web page will stimulate the user’s impulse to scroll, so it shouldn’t be necessary to push “important” information up to that 600-pixel-high area.
I can’t help but note, too, that besides one technologically challenged mother-in-law, I don’t know one person who actually owns a netbook. I might consider your perspective more seriously, however, if you were to cite stats on more popular devices – cell phones, tablets, laptops of various sizes, desktops with varying monitor sizes…
The fact is that people do not want to scroll.
They need to get the important information in the first fold.
And while you CAN put valuable information below the fold, click tracking heat maps show us that few go there to find it.
Reg, thanks for the comment! I still must contend that the fold is becoming obsolete, particularly as HTML5 sites like this one are built to focus more on responsive layouts and less on a mythic “standard browser size.” Although it’ll be many years before HTML5 dominates, responsive website design is hugely important even with more traditional HTML4 builds.
As designers, we must follow the trends in new technology. This site is set up to fit the device, be it a computer, a tablet, or a phone. It would be impossible to design for the hundreds of folds created by different browsers, tablets, cell phones, and other devices. If I’m on my cell phone or tablet, I expect to scroll; if more than half the Internet-viewing public primarily accesses the Web from their mobile devices, then they’ve adapted to scrolling too. It’s up to us as designers to build websites that aren’t antiquated in their structure, that are responsive and show cognizance of trends in today’s technology.