Does the “Above the Fold” Web Design Rule Still Apply?

Matt Adams Web Design & Development

Anyone familiar with web design will tell you to keep your relevant information above the fold.

But is it obsolete in the modern world?

The truth is that web design has been changing rapidly over the last half-decade and the age-old adage isn’t necessarily true these days. Let’s hop right in and we’ll explore why things have changed and what you can do to react to modern web design.

What Does Above the Fold Mean?

For those who aren’t familiar, the terminology behind “above the fold” comes from print. It refers to the top half of a newspaper or tabloid.

In web design, it would be more accurate to say that it comes before the scroll. It’s the top part of the page which appears before the user scrolls down with their finger or mouse wheel.

Still, the terminology stuck and while it gets the occasional eye roll there’s rarely any confusion when the term is used.

The general rule of thumb is that everything relevant to the page should be above the fold. That includes a short call to action, contact information, and what your page is there to do.

In the early days of the internet, it was fantastic advice. After all, most people were barely familiar with their computer at the time, let alone the internet. Your job was to make everything as easy as possible for people to find.

That’s not the case these days.

Enter the Smartphone

Smartphones changed the way people use the internet. These days there’s a huge percentage of people using tablets and smartphones to access the internet regularly.

In the second quarter of 2019, for instance, 59% of searches were made from some form of mobile device.

While there’s a lot of thought given to using a reactive website that changes based on the size of a screen, few people actually consider the fact that mobile users often scroll rapidly. Think about it this way: some of the most common apps used on phones are for social media feeds.

Chances are that you’re just as used to scrolling on your phone as prospective customers. What appears at the top of a page doesn’t need to give you all of the information… it needs to hook you into scrolling downwards.

This has changed the way that websites are scanned for information.

It’s not the death of the top of the page, but it’s changed the way that it should be used.

Storytelling at the Top

Instead of placing all relevant information and a call to action at the top of a page, many people have opted for a different route:

Storytelling.

Essentially, you get the user of the page hooked into reading a story as they scroll down the page. You can take advantage of this on both desktops and mobile devices but the approach will need to be different for you to get the best effect.

On a desktop webpage, for instance, large images can be seen clearly. You’ll still want your menus visible and some easy way for the reader to do what you want, whether it’s contacting you or signing up for a list.

However, placing content strategically after the hook and answering the viewer’s questions as they scroll down is a great idea. You tell a “story” which is actually the answer to what your business does.

A successful hook will give you much more digital real estate to bring in your customers. You’ll still want to incorporate the basics of drawing the eye. Content should be visually optimized and broken up with images.

Meanwhile, on a mobile site, you have less space to show the user what they want. Instead, you can launch directly into the story and bypass the larger hook you would use for a desktop version of the page.

In essence: you’ll tell the same story but you’ll use the strengths of the medium. A desktop hook draws the user into the story with a larger visual format, while a mobile version of the same page needs to present more information in a smaller space.

Moving Beyond Reactive Sites

These days nearly everyone can make a reactive website easily. Nearly every theme available for WordPress, for instance, is automatically reactive. You’ll just need to do a little bit of tweaking and the basics can be learned in a couple of hours.

On the other hand, a professional web design service will take things to the next level.

If they’re worth using they’ll already know all of this information. The “above the fold” concept isn’t dead, it’s just changed with the times and technology.

A reactive site is pretty basic.

Taking advantage of the format and essentially creating two different web pages for different devices is a lot harder than picking out a theme. It takes knowledge of how people use the internet in the modern world as well as the ability to keep everything on point.

While the website is still technically reactive, it’s moved into a new realm when done right.

Instead of jamming information and buttons above the fold, the focus needs to be on the storytelling hook and easy navigation. Internet users are more complex these days, and your web design needs to reflect that.

Ready for Some Help?

Now that you know the old “above the fold” concept is a bit obsolete you may be wondering how to take the next step. Things are a lot more complex than most web design blogs will lead you to believe.

You can spend the time learning to properly code a reactive site, organizing the content strategically, and performing split testing to see how things perform.

Or you can keep that time for your business and hire a professional.

If you’re in the Columbus, Ohio area and you think your small business needs to step up their digital game you’re in the right place. Contact us today and we’ll see what we can do for you.