foldIt's guaranteed that in every web design project, the client has and will continue to worry about what lies above versus what lies below this thing called The Fold. One would assume that above the fold is all that matters, however if your goal is to connect with new customers, then you might consider thinking below the fold. Jacob Neilsen and Peep Laja tell us that 80% of visitors do not scroll under this fold. If 80% don’t scroll below the fold, is it because they don’t like to scroll, or is it simply because they already know what they’re looking for and go directly to the nav menu or search bar? These visitors are more likely to already know you or already be a customer. What’s important is acquiring new customers, and focusing below the fold is a strategy that bets that new customers are more likely to be within the 20% of visitors who scroll below the fold to first get a feeling for the brand and whether it will be worth digging deeper.

A few things to keep in mind:

1. The goals of each website and each visitor are unique. A visitor to a product review site is very different from one planning a vacation on a resort website. 2. Many visitors are looking for something specific and tend to go straight for navigation or search. Doesn’t it make sense that 80% don’t scroll down? 3. Users know how to scroll!!! Our endless scrolling of social media feeds should be clear evidence. Let’s at least put this one to bed.

With all of that in mind, we design many sites for brands that need to first introduce themselves to visitors to gain their trust before asking for their money. These clients are not selling commodity items. Many are resorts selling an expensive vacation experience. So, one design strategy is to keep the area above the fold simple and always visually stunning. Provide clear navigation for returning visitors and searchers who know what they're looking for. Assume that those scrolling below the fold are new potential customers and make sure to deliver the breadth of the brand by the time they reach the footer.

Here are two examples of sites following this strategy: The Four Seasons and Crystal Springs.

 

FourSeasons-CostaRica-FullScreen             crystal-home-full 600

#1 The first example that I’ve used for years has been the Four Season’s site. Above the fold it provides clear navigation. It offers a visually compelling experience that stirs emotions and draws the visitor in deeper. It provides a clear path to conversion : Make a Reservation in contrasting red. Then below the fold, they introduce the visitor to their destination and provide an excellent summary of the exciting (or relaxing) experiences that await. By the time you reach the footer, you get it.

#2 Another example is the responsive website we recently launched for the Crystal Springs Resort in New Jersey. With 7 golf course, 3 hotels, 2 spas and 11 dining options, we had a lot to introduce.  As the user scrolls below the fold, we start by summarizing all of the key offerings and providing some promotions for events or services. Then we use full frame visual panels for each category such as golf, hotels, etc. Each panel also scrolls horizontally to see all the other products/services within the category. Finally the page ends with an Instagram feed.

After browsing just the homepage, the visitor gets a great visual overview of the resort and leaves with the key message that Crystal Springs Resort is beautiful, fun and relaxing, and they offer something for everyone.

 

While there is no questioning the value above the fold, the more that is crammed in there, the less impact any of it will have, and there is the rub typically. Stakeholders always want their sacred cow above the fold. Above the fold, provide clear navigation and clear visual messaging. Below the fold, introduce the brand and provide a visual experience that will inspire new visitors to take the next step to become a customer.

2 Comments