The First Fold: What Customers See in the First 3 Seconds

When someone opens your website, you have just a few seconds to answer three questions that run through their mind, even if they don't realize it: where am I, what do you do, and what should I do now? If the first screen, what we call the "first fold" or "hero," doesn't answer these right away, the visitor goes back to Google and opens a competitor's site.

What is the "first fold"

It's everything that appears on the screen without the user having to scroll. On a phone, that's very little space. So every element there has to earn its place. It's not where you put everything, it's where you put only the essentials, with clarity.

The 4 elements that can't be missing

• A headline that says what you do and for whom. No empty poetic phrases. "Barbershop in downtown Austin, no waiting" communicates more than "Style and attitude."
• A short supporting subtitle that reinforces the differentiator or answers the main question.
• A clear call-to-action button (the main one): "Text us", "Get a quote", "See the menu". Just one in focus, at most a second one, subtle.
• A quick trust signal when it truly exists: Google rating, years in business, a real photo of the space. Never make this up.

The most common mistake: the carousel nobody reads

Many people fill the first screen with a carousel spinning through 5 images. The visitor doesn't wait for the second one to pass. One right image, static, with readable text over it, converts better than any animation.

Button: position matters more than color

The main button needs to be visible without scrolling, with good contrast and space around it to "breathe." On mobile, it should be wide enough to tap with a finger and stay in the thumb's reach zone. A beautiful text is useless if the action is hidden below. And the hero is just the beginning: the path from click to text needs to be clear throughout the page.

Contrast and readability

If you use a background photo, you'll almost always need a dark overlay under the text to keep it readable. Text that blends into the background is the quietest way to lose a customer: they don't complain, they just leave.

How to know if yours is good

Do the 5-second test: show your website's first screen to someone who doesn't know your business and ask, "what does this company do and what can you do here?" If they hesitate, the hero needs adjustment.

At Stau, the first fold is the part we care most about in every site we build, because it decides if the rest gets seen. Want an honest opinion on yours? Start the builder on stau.io, watch your site build itself in about 3 minutes, and see the free preview for 7 days. No commitment, just a clear look at what you can improve in your first fold.