Web Design Jax Get Started

Rethinking ‘Above the Fold’ in Web Design

Does the fold in web design still matter?

Time to Rethink ‘Above the Fold’ Placement?

There was a time when most visitors heading to a webpage automatically saw what was at the top. Because of this, website designers have long focused their attention to this particular piece of prime real estate. Consider how a webpage is viewed on a typical smartphone or tablet today and you’ll start to understand why “above the fold” placement isn’t such a big deal anymore and why it’s time to design websites from a different perspective.

Mobile Viewing Habits Eliminate the Fold

The trend towards mobile browsing is showing no signs of slowing down. Most adults now spend more of their time on mobile devices rather than desktops. Laptops still outrank smartphones as the most-used device to perform Internet searches, but it’s only a matter of time before mobile becomes even more prevalent. Mobile visitors to a site can easily zoom in and out and change orientation and get a view that extends beyond the traditional fold to get a more expansive view of a page.

Content Matters More

There are plenty of stats to show that most people still spend more time reading what’s initially seen on a site, but there’s also evidence suggesting some call-to-actions placed at the bottom of a page way out perform CTAs above the fold. Why the mixed message? It’s because content matters more than where the CTA is actually placed. Any visitor to a site needs to be motivated to stick around long enough to scroll beyond what comes up when they first land on a page. The takeaway here? Compelling content matters most.

Motivation Has Nothing to Do With the Fold

Regardless of how someone is viewing content, you’re only going to get about 20 percent of viewers to continue beyond headlines. What really drives conversions is a motivation to keep reading beyond what first catches the eye. A test was done with Boston Globe webpages with multiple pages having similar content with CTAs placed differently. There was no significant difference in results because content is what actually provides motivation to take the desired action.

What Should Go at the Top?

Just because the fold is no longer a valid dividing point of a webpage doesn’t mean the top half of the page is useless. Roughly 80 percent of a visitor’s attention is still directed here. For a retail site, something like, “Save 20% on All Orders,” in huge bold letters is still going to get attention when placed at the top. As a general rule, the top of your page should include:

  • Engaging headlines
  • Compelling images/photos
  • Encouragement to scroll down or read on
  • Relevant, easy-to-digest content
  • The ‘False Fold’ and Missed Opportunities

Even with the fold having been obsolete for quite some time, many website designers still design sites with an imaginary fold in their head. Shift your way of thinking and consider the first half of a page as a preview of what’s offered beyond that point. Break the “imaginary fold” rule by:

  • Telling a short, compelling story to encourage scrolling
  • Using multiple CTAs on a page since some visitors will arrive on a page ready to take action
  • Strategically placing internal links within content to direct visitors to more detailed info

Looking for an Usability Balance

Create a reason to scroll by finding a balance that will likely encourage visitors to scroll. One way to do this is to place a tease at the top of the page and offer a little more of the reveal as the content proceeds. There is no magic formula achieving this balance. You’ll need to do A/B testing and dive into your site’s metrics to see what’s working and what needs adjusted.

The disappearance of the fold presents some design challenges. Think with your thumb and make navigation as easy as possible. Place content throughout a page rather than concentrating on a single focal point. Leave enough space for tapping since mobile screens are smaller and require better manual dexterity. You may do better with having one site for desktop browsers and another for mobile traffic. It all depends on where your traffic is coming from and what actions are normally taken by visitors. Ultimately, each page of a website needs to offer something engaging and useful, regardless of where everything is placed.