What’s “Above the Fold” in the Best User Interface Web Designs

by Alex Stetson

“Above the fold” is a term that originated in newspaper design, and literally referred to the content on the front page of that was visible before the paper fold.  Now this term is widely used with reference to the web in user interface design.

Working definition: “Above the fold” refers to the top portion of a web page that is the area immediately visible in the browser.

Whatever’s above the fold is what visitors see when they first arrive on your homepage or landing page.  If this content doesn’t appeal to them, they likely aren’t likely to stay long enough to see more.  For this reason, it’s an essential practice of good user interface design to put the most important content in this readily visible space above the fold.

In one effortless glance, the content above the fold should clearly indicate who the site is for, what it’s offering, and how the user can access it/find out more.  If used correctly, this space should give the user a silent indication of how to best navigate through the site.

To keep them on your site, the content above the fold must be interesting and appealing to the user.  Attractive, large images that are accurate visual representations of your services and brand are a great focal point for the area above the fold; maybe you even want to display your own work here.  Whatever you choose, it should tell something, but not everything, about your website.  Preserving a sense of mystery and not giving too much explicit data is a key technique for good user interface design above the fold; this is how the site will retain the interest and curiosity of the visitor and drive them to look further, below the fold and beyond.

To appeal to the user’s sense of purpose, it’s important that the content placed above the fold establishes a clear positioning statement.  This should be a concise, one-liner that describes what the site is, what it does, and who it’s for.  If it’s unclear what the site is offering from the get go, the user will become confused and disinterested.

Including a clear call to action that tells the user where to go next is just as important.  This is always a priority for user interface web design—designing the initial visual space so that the user can quickly and easily move forward through an intended process.  Delineating a clear call to action through the web design layout that’s immediately visually available will keep the user focused on task.

Seeing a company’s clients represented on their website page helps to earn a site visitor’s trust.  If your site’s primary purpose is to sell a service or product, then it may be a good idea to integrate notable past client logos, or even testimonials into the design layout above the fold.

What you place at the top of your homepage is crucial because it informs the user what to do next.  Be forward thinking and strategic when you plan what goes above the fold on your web design.  Stick to clear, simple lines and spaces, and don’t forget to get feedback and make iterations on your user interface design by conducting user testing.

About Alex Stetson

Alex heads up Fresh Tilled Soil’s marketing efforts both on and off the web; she's dedicated to building and growing Fresh Tilled Soil's brand experience...