Above the fold: what a first-time visitor needs in five seconds

The people who most need this are the ones least able to see it. You know what your business does. You cannot un-know it, so you look at your own homepage and it reads as obvious. To a stranger arriving from a search result, it is a page of shapes.

That first screen is doing one job, and it is not impressing anyone. It is confirming that the visitor landed in the right place. Confirmation, not persuasion.

What does a visitor actually need to see first?

The service, in the words a customer would use. Not your positioning statement. If you install and repair HVAC systems, the headline says that. "Comfort, delivered" says nothing and could belong to a mattress company.

The place. A city or a region, visible without scrolling. Local buyers are checking whether you are near enough to be plausible, and they check that before anything else.

One reason to believe you. A license number, years in business, a review count, a recognizable name you have worked for. One is enough at this height. Piling on five reads as insecurity.

And a way to act, sized for a thumb. A phone number that dials when tapped, or a single button, not four competing options. Click to call on mobile is still missing from a surprising number of sites, and it is the cheapest fix in this entire category.

Four answers, one screen, no scrolling. That is the whole specification.

Order matters less than presence. A visitor who can find all four in any arrangement will scroll. A visitor missing one of them closes the tab and cannot tell you which one was missing, because they never consciously looked for it.

Why does the city name matter so much?

Because local buyers are doing an elimination round, not a comparison.

They have three tabs open. In the first pass they are not deciding who to hire, they are deciding who to close. A site that does not make its service area obvious gets closed, because checking takes effort and the next tab does not require it.

This gets missed most often by businesses that grew. You started in one city, you now cover six, so the homepage went generic to avoid picking favorites. The result is a page that feels local to nobody.

Name your main city or your region plainly in the first screen, and let the individual service area pages carry the rest. Being specific about one place does not cost you the others.

The same discipline applies when a business changes its name or its look. The fold is where recognition lives, and a rebrand that ignores what people already recognized can quietly erase the one thing a returning visitor was scanning for.

Is the hero image doing anything?

Usually not, and often it is actively in the way.

A full-width photo pushes the four answers below the fold on a phone. On a small screen, a tall hero image can consume the entire first screen and deliver nothing except a general impression of a business that exists.

Stock photography is worse than no photo. Buyers recognize it instantly, and the moment they do, the page reads as a template. A blurry real photo of your actual crew, your actual dining room, your actual truck outperforms a polished picture of models in hard hats, because it is evidence rather than decoration.

The weight is the other half of the problem, and Google has measured it. In the research footnoted alongside its mobile speed benchmarks, Google Research sampled 11 million global mobile web domains over a globally representative 4G connection in January 2018 and found that above the fold content took more than five seconds to display and more than seven seconds to load fully. In that sample, 79% of pages were over 1MB, 53% were over 2MB, and 23% were over 4MB, and 25% of pages could have saved more than 250KB by compressing images and text alone. The five second title of this article is not a rhetorical device. It is roughly how long the median mobile page took to show its first screen.

Google's current Core Web Vitals thresholds put Largest Contentful Paint at 2.5 seconds or less to be rated good, and worse than 4 seconds as poor, assessed at the 75th percentile of visits. On most local business homepages, the element deciding that score is the photograph sitting exactly where the four answers should be.

If the image is not carrying one of the four answers, shrink it or cut it. Large hero images are where load time and clarity fail together, and page speed matters at the point where people are still waiting, not as a number to chase.

One caution about the speed numbers you will be quoted. Google has published the same mobile bounce finding three times with different figures, and vendors present the versions as if they were separate studies. The February 2017 edition says that as page load time goes from one second to seven seconds, the probability of a mobile visitor bouncing increases 113%. The February 2018 update, which is the version live on Google's own page today, says one second to 10 seconds and 123%. A third figure in wide circulation, one to three seconds and 32%, appears in neither primary document. They are not three findings. They are one finding, re-run, and anyone quoting a bounce number without naming the edition has not opened the source.

The other study you will hear is Google, Fifty Five and Deloitte's "Milliseconds Make Millions," and its limits matter. It covered 37 brands across EMEA and the US, analyzed hourly over a 30 day period totalling 30.5 million sessions in October and November 2019. A 0.1 second improvement in mobile load time was associated with retail conversions 8.4% higher and average order value 9.2% higher. Those are ecommerce figures from large brands and they do not transfer to a plumbing homepage. The closest segment to a local service business in that study is lead generation, six of the 37 brands, where the bounce rate on information pages improved 8.3%. Still large brands, still 2019, still directional rather than a forecast for you.

How much of the first screen do you actually have?

Less than you think, and you can measure it exactly rather than argue about it.

Take a common phone viewport, 390 by 844 CSS pixels. Browser chrome, the address bar plus the bottom toolbar, takes roughly 130 of those. Call it 714 pixels of page above the fold.

Now spend it on a typical hero block:

• Sticky header with logo and menu: 70 pixels
• Hero image, full width, cropped 16 by 9: 390 times 9 divided by 16, roughly 219
• Headline, two lines at 32 pixels with leading: 84
• Subhead, two lines: 56
• Button, 48 tall with 20 pixels above and below: 88

That totals 517 pixels, leaving 197 for a trust line and a tappable phone number. Everything fits, and a stranger gets all four answers.

Now swap the 16 by 9 crop for the square image your designer preferred. A full width square on a 390 pixel screen is 390 tall. The total becomes 688 of your 714. The button survives by 26 pixels, the trust line is gone, and one extra line in the headline pushes the button off the screen entirely.

Rerun it with your own numbers. Screenshot your homepage on the phone in your pocket, measure the hero against the full screen height, and subtract. The arithmetic almost always says the same thing: the photograph is eating the answers.

How do I test my own fold honestly?

You cannot judge your own page, so borrow someone else's eyes for thirty seconds.

Find a person who does not know your business. Show them the first screen on a phone for five seconds, then take it away. Ask three questions. What does this company do, where are they, and what would you tap next. Their answers are your score. Do it with four or five people.

That exercise is more useful than the alternative most agencies will offer you, which is a testing program. What a test needs is not a traffic threshold. It is set by the metric's variance and by how small a change you want to catch, as Kohavi, Deng, Longbotham and Xu put it in their KDD 2014 paper. Sessions per variant = 16 × p × (1 - p) ÷ d², where p is your conversion rate, d the lift you want to detect, and 16 is 2(1.96 + 0.84)² rounded, for 95% confidence and 80% power. At 3%, catching a fifth of that rate takes about 12,900 sessions per variant (derived), so split testing does not produce valid results at local traffic levels. Five strangers and a stopwatch beat a testing tool at this scale, every time.

Then check the fold on a real phone, not a browser window resized to look like one. Older Android devices, small screens, and text scaled up for accessibility all change where the fold actually lands. A visitor running larger system text can lose an entire element you assumed was safe.

What to do this week

Screenshot your homepage on a phone. Crop it at the fold. Look at what remains.

If the service is not stated in plain words, rewrite the headline this week. Say the service and the city, in one sentence, in the language a customer would use in a search box.

If the phone number is not visible and tappable in that screenshot, fix that today. It is a fifteen minute change and it is worth more than most redesigns.

Run the pixel arithmetic above on your own hero. If the image is taking more than about a third of your available height, crop it or move it below the answers.

Then run the five-second test on five people who do not know your business. Write down what they got wrong. Those are your edits, in order.

Do this before you increase any ad budget. Paid clicks land on this exact screen, and what you pay for ad management every month buys you nothing if the page they land on cannot say what you do.

Questions about your homepage fold?

Email me at eric@seod.com with your homepage URL. I will look at it on a phone for five seconds, close it, and write down from memory what I think your business does and where you do it. Then I will send you exactly that, unedited.

It is a blunt exercise and it is usually the most useful thirty seconds anyone spends on your site that month. If I get it right, you are in good shape and I will say so.

Otherwise, keep going through the conversion library.