What Should Go Above the Fold?
What visitors should see before they scroll: a clear offer, who it is for, one proof signal, one next action, and a page that loads fast. Includes examples for clinics, suppliers, restaurants, training institutes, and online stores.
You open your own website on your phone while you wait for a meeting. A photo of your building fills the screen, slider dots blink in the corner, and the headline says "Welcome to Excellence." A stranger would not know what you sell, who you serve, or what to do next. That first screen is where most visitors decide whether to stay.
So here is the answer. Before anyone scrolls, they should see five things: a plain statement of what you offer, who it is for (and where, if location matters), one believable reason to trust you, one clear next action, and a cue that more useful detail is waiting below. All of it should load quickly on a mobile connection. Your company history, the full service list, and team photos can come after the scroll.
What "the fold" means now
The fold is the bottom edge of the screen when a page first loads. On a desktop monitor it sits much lower than on a phone, and a responsive site has a different fold on every device. Nielsen Norman Group points out that the exact position varies, but every visitor still has a fold. People treat content they can see straight away differently from content they have to go looking for (Nielsen Norman Group, The Fold Manifesto).
For most local service businesses, the fold that matters most is the one on a phone. Enquiries often start on a phone, from a search result, a map listing, or a link someone shared in a chat. If the first phone screen is mostly image, the visitor sees a picture and nothing else.
Why the first screen still carries the most weight
People do scroll. They just don't give every part of the page the same attention. In a 2018 eye-tracking analysis, Nielsen Norman Group found that 57% of viewing time went to content above the fold and 74% went to the first two screenfuls (Nielsen Norman Group, Scrolling and Attention).
The same research group warns about "false floors." These are first screens that look sparse or finished, so visitors assume there is nothing more and leave. Their advice is that people scroll when they have a reason to, and an arrow pointing down is not a reason.
The first screen is not decoration. It decides whether anyone reads the rest of the page.
In business terms, a weak first screen doesn't just look a bit generic. It quietly cuts the number of people who ever reach your services, your proof, and your enquiry form.
The five-part first screen framework
Use this as a checklist for your homepage and every important service page. Each part answers a question the visitor is already asking.
1. A headline that names the offer
The headline should say what you do in words a customer would use. "Your trusted partner for success" could belong to any company. "Commercial air conditioning maintenance for offices and warehouses in Muscat" belongs to one. If the headline would still make sense on a competitor's site, rewrite it.
2. Who it is for, and where
A short line under the headline should name the customer type, the service area, or both. A B2B supplier might say "for contractors and facility managers across Oman." A clinic might name its neighbourhood and opening hours. This tells the right visitor they are in the right place, and it tells the wrong visitor quickly, which saves your team time on poor-fit enquiries.
3. One proof signal
Pick the single strongest reason to believe you and keep it short. It could be a review rating with the number of reviews, logos of recognisable clients you have permission to show, years in operation, a relevant certification, or a clear guarantee. Use only signals that are true and that you can back up. Visitors check.
4. One primary action
Choose the one action that best fits someone arriving on this page. That might be calling, messaging on WhatsApp, booking an appointment, or asking for a quote. A second option is fine if it is visually quieter. Five equal buttons make the visitor choose before they are ready, and most of them choose to leave.
5. A reason to keep scrolling
Let the next section show slightly at the bottom of the screen, or add a short line of benefits that leads into the detail below. This avoids the false floor and makes scrolling feel worthwhile.
This sequence of offer, fit, proof, and action is also how the Growth System plans each page around a single next step, so the first screen and the rest of the page work toward the same decision.
What usually does not belong above the fold
- Auto-rotating sliders. Every slide competes for the same space, and only the first one is guaranteed to be seen. Choose one message.
- Full-screen pop-ups on arrival. Google says intrusive interstitials that cover the content can frustrate users and erode trust, and they can make content harder for search engines to understand, which may hurt search performance (Google Search Central). If you need a newsletter or offer prompt, use a small banner.
- Heavy background video or oversized hero images. The hero image or headline block is often the largest element Google measures for Largest Contentful Paint, and Google treats 2.5 seconds or less as a good result (web.dev, Largest Contentful Paint). A slow hero means visitors stare at a blank or half-loaded screen right when they are deciding whether to stay.
- Welcome messages and mission statements. These matter to the business but rarely help a visitor decide anything. Move them to the About page.
- Long navigation menus pushing the content down. On mobile, the menu should collapse so the headline and button appear straight away.
Examples for different business types
Every first screen needs the same five parts, but what goes into each part depends on how your customers buy. Use this table as a starting point.
| Business type | Headline should say | Strongest proof signal | Primary action |
|---|---|---|---|
| Medical or dental clinic | Services, neighbourhood, and opening hours | Review rating, licensed practitioners, insurance accepted | Book an appointment or message on WhatsApp |
| Law firm or consultancy | Practice areas and the type of client served | Sectors served, credentials, years practising | Request a consultation |
| B2B supplier or contractor | What you supply, to which industries, and coverage area | Client logos shown with permission, certifications you actually hold | Request a quote |
| Restaurant or café | Cuisine, location, and hours | Photos of real dishes, review rating | View menu, reserve, or order |
| Real estate agency | Property types and areas covered | Current listings count, licence details | Browse listings or talk to an agent |
| Training institute | Course name, outcome, and next start date | Accreditation or partner recognition | See the next intake or register interest |
| Online store | Product category and delivery promise within Oman | Delivery times, returns policy, payment options | Shop the main category |
An illustrative before and after
Picture a hypothetical facilities maintenance company in Sohar. Its current first screen has a full-width photo of a technician, the headline "Excellence in Every Detail," a rotating slider, and a single "Learn More" button.
A stronger version would read: "Planned maintenance for factories and warehouses in Sohar and Al Batinah." Underneath: "HVAC, electrical, and fire systems serviced on a fixed monthly schedule." Next comes one proof line, such as a 24-hour emergency line if the company really offers one. Then a main button, "Request a site visit," with a smaller "Call now" link beside it. The photo stays, but smaller, so all of this fits on the first phone screen.
Nothing about the business changed. The difference is that a facility manager can now decide in a few seconds whether to get in touch.
Bilingual and mobile details that change the first screen
If your site runs in Arabic and English, put the language switch where people expect it, at the top of the page, and make it easy to tap. Write the headline natively in each language. A literal translation often turns a sharp English headline into a vague Arabic one, or the other way round.
Arabic pages read right to left, so the layout flips. Check that the headline, proof line, and main button still sit where the eye naturally lands, and that a long Arabic headline doesn't push the button below the phone fold.
On mobile, test the page on an ordinary phone over a normal connection, not only on the office Wi-Fi. If the button appears only after the hero image finishes loading, that is the first thing to fix.
The five-second first screen test
Open your homepage and your top service page on a phone. Show each one to someone who doesn't know your business for five seconds, then ask:
- What does this company offer?
- Who is it for, and where?
- Why should I believe them?
- What would you tap next?
- Did you feel there was more worth scrolling to?
If they can't answer three of these clearly, the first screen needs work before you spend more on ads or SEO.
Fix the page, or fix the structure?
Sometimes a weak first screen is just a copywriting problem, and a sharper headline and button fix it in an afternoon. Often, though, the first screen is vague because the page itself has no clear job. The offer isn't defined, the audience is too broad, or nobody has decided what the next step should be. A new hero image won't solve that.
If your homepage and several service pages share the same problem, treat it as a structure issue across the site rather than one page at a time. When you are deciding between targeted fixes and a wider rebuild, the Growth Packages page sets out the different levels of support.
The next step
Run the five-second test on your two most important pages this week and write down the answers. If the gaps are clear, you already know what to change. If you'd like to see how a whole site can be planned so every page leads to an enquiry, see how the Growth System structures pages that pre-sell the next step.