Web Design + UX / UI

An argument for and against "Above the Fold"

By:

Emilee Dover

on 9/27/2017

This has to be the bajllionth article written about “Above the Fold,” I know. I even own a book titled Above the Fold that I got after a conference a hundred years ago (I mean 2011 is essentially “ancient” by digital terms, and I’m clearly into hyperbole right now).

We know people scroll. We have loads of research and evidence surrounding this point.

No matter how many of these research articles we show to a client, there is still always an “above the fold” conversation. I am here to say that the client is unceremoniously correct in their concern. We call this First Glance or First Feeling.

There is nothing that replaces a human’s instant reaction to an experience. The feedback that a human receives and gives during this moment is pivotal to next steps to the rest of their experience. This isn’t a new idea. The initial interactions that a user has with a brand can determine how long they stay and how invested their involvement will be. This can mean length of scroll depth, time on page, and conversions.

And then the client says, “Exactly! So we need them to be able to access as much information as possible right away. We have so many things we need them to understand upfront.”

And here is where things get muddy.

A retail store designer wouldn’t put all of the product at the front of the store because “customers need to know we have jeans too!” That is how we end up with web experiences that have a dozen calls to action and two dozen more link paths.

Now First Feeling really gets it’s power. As designers, we must:

  1. Provide enough information to the user to inform decision-making*
  2. Titillate** the user enough to make them want to explore more information

*It’s important to sufficiently supply exactly the right amount of information for them to feel confident and intrigued to do that exploring.

**I’ve wanted to use that word in an article for a long time– specifically for its creepiness.

Here’s how that can easily go wrong:

  1. You provide the user with too many decisions so they give you the highway salute and bounce out.
  2. They become so enamored with the initial experience that they leave without achieving your business goal.
  3. You don’t provide enough information, or quick access to the information they are searching for, and they become frustrated.

Since this is such an essential piece of design, we write First Feeling/Glance into our process in a few different ways including the Creative Brief and the Voice & Tone Guide.

First Glance refers specifically to an initial visual sensation. Many times, this might include the client’s one large “must-have” or attempt to accomplish the primary goal.

First Feeling applies more to the feedback from the user. “I understand (something) about this brand because of [x].”

In Use

We are still working through the best ways to apply First Glance and First Feeling in different situations. For something more tactical, the First Glance might be “Showcasing community events” whereas the First Feeling might be “an understanding that the brand is ingrained in community and involved in its operations.”

If we are executing a specific deliverable where we can focus in a bit deeper, the First Glance might be “[Brand X] is an energetic brand that is always iterating and moving to the next challenge” whereas the First Feeling might be “I am excited and intrigued by the glimpses of products I am seeing. I have to figure out what they are because I am inquisitive about future-forward inventions.”

Share to

Related Posts

4 AI Resources To Add To Your UX Design Toolbox

By:Morgan Plappert on 7/18/2023

These AI-powered tools can help you streamline your workflow and empower you to take your designs to the next level.

Read More »
Wireframing vs. Prototyping and Everything In-Between

By:Morgan Plappert on 7/14/2020

Prototyping demonstrates ideas, and baking prototyping into your workflow can begin to shift the way you think and approach design problems as a whole.

Read More »