Above the Fold: What Actually Belongs on a Service Business Homepage

Most service business homepages waste their first screen. The hero shows a stock photo of a smiling team, a headline that could belong to any company in any industry, three "value propositions" that are actually slogans, and a button labelled "Learn More" that leads to a page no one asked to read.

The visitor spends a few seconds deciding whether to keep going. If the top of the page does not answer the simplest questions about who you are, what you do, and what to do next, they leave. The rest of the homepage may be lovingly crafted, but no one sees it.

This is what actually belongs above the fold on a service business homepage, and what to leave below it.

"Above the Fold" Still Matters, Even Though People Scroll

Designers like to argue that "the fold" is a print-era myth because everyone scrolls. The first half of that sentence is wrong and the second half misses the point.

Nielsen Norman Group's research, summarised in their page fold manifesto, is unambiguous: people do scroll, but only after the first screen earns it. Their long-running eye-tracking studies show that attention drops sharply below the fold. The first screen does not have to do everything, but it does have to convince the visitor that the rest is worth their time.

The fold is not a fixed pixel line — it varies by device — but the principle is the same on a 13-inch laptop and a 5.5-inch phone. The first screen is the audition. If you fail it, the resume goes in the bin.

The Five-Second Test

The cleanest way to evaluate your hero is the five-second test, which has been a staple of usability research for two decades. You show the page to someone for five seconds, take it away, and ask three questions:

• What does this company do?
• Who is it for?
• What can you do here?

If they cannot answer all three from a glance, the hero has failed. It does not matter how clever the typography is or how nice the photography looks. The hero is the answer to those three questions or it is not doing its job.

Most service business homepages fail the test on question one. "We help you grow." "Modern solutions for modern businesses." "Your trusted partner since 2014." These are slogans, not answers. They tell the visitor nothing about whether they are in the right place.

The fix is to write the headline as if you were finishing the sentence "We do ___ for ___ in ___." For a moving company in Calgary that focuses on apartments, that is "Local apartment moves in Calgary, booked in under five minutes." For a dog grooming business in suburban Toronto, "Calm, low-stress grooming for senior dogs in Etobicoke." Specificity is what makes the visitor's brain say "yes, this is for me" or "no, this is not."

What the Hero Has to Do, in Order

The hero on a service business homepage has six jobs. The order matters.

1. Name what you do, in plain language. This is the headline. It should not be clever. It should be the kind of sentence a stranger could repeat to a friend after one read. CXL's analysis of high-converting headlines is consistent: the value proposition belongs at the top, written in the visitor's vocabulary, not the brand's.

2. Add the qualifier. This is the subheadline. Service area, audience, format, price posture, response time — whatever the headline assumes. "Same-day quotes by phone or text" is a qualifier. "Insured and licensed in Alberta" is a qualifier. "Starting at $89" is a qualifier. One sentence, sometimes two.

3. Show the action. One primary call to action button. Not three. Not "Learn More" next to "Contact Us" next to "Get Started." Pick the one action that matters and make it the most visible thing on the page. The label should describe the result, not the mechanic. "Book a Free Quote" beats "Submit." "See Available Times" beats "Schedule."

4. Support the offer with the right image. This is where most homepages quietly sabotage themselves. Stock photography of generic teams looking at laptops adds nothing and signals that the business is hiding. A photo of the actual team, the actual work, or the actual result earns trust in the same glance the headline earned attention. The conversion-focused design work we do on service homepages almost always starts by replacing the stock hero with a real photograph from a recent job.

5. Show one piece of proof. Not a wall of testimonials. One specific signal — a star rating with a real review count, a recognisable client logo strip, a "1,200 jobs completed" counter, a photo of the owner with their first name and credentials. The proof should be a handhold, not a brochure.

6. Hint at what is below. A small visual cue — a subtle arrow, a slight overlap of the next section, an obvious next heading — tells the visitor there is more, without making them think. Smashing Magazine's piece on scroll cues is a useful reference for what works and what feels hokey.

The Two Headlines Most Homepages Get Wrong

There are two specific headline mistakes that show up on almost every service business homepage. Both are easy to fix once you see them.

The brand-as-hero headline. "Welcome to Acme Plumbing." "About Us." "Our Story." The headline is about the company, not the visitor's problem. The fix is to lead with what the visitor wants. The company name belongs in the logo. The headline belongs to the offer.

The slogan-as-headline. "Excellence in Every Job." "Where Quality Meets Care." "Building Better Tomorrows." These are board-meeting language, not customer-facing language. The fix is to replace adjectives with nouns. "Quality" is an adjective. "Same-day repair appointments" is a noun. Visitors respond to nouns because nouns describe things they can imagine receiving.

Joel Klettke's conversion copywriting writing is full of examples of headlines rewritten from slogan to substance, and the pattern is always the same: the winning headline is more specific, more concrete, and shorter than the one it replaced.

One CTA, Above the Fold, Always

A homepage with three competing calls to action above the fold is a homepage with no calls to action. Every extra option is a small tax on the visitor's attention, and the visitor pays it by not deciding at all.

The Hick-Hyman law, summarised in this Interaction Design Foundation overview, is the formal version of the rule: decision time grows with the number of choices. The practical version: every CTA you add to the hero reduces the chance that any of them get clicked.

Pick one primary action and make it the most visible thing on the screen. The right action depends on the business:

• Quote-based businesses: "Get a Free Quote" or "Request an Estimate."
• Bookable businesses: "Check Availability" or "Book a Visit."
• Consultative businesses: "Book a 15-Minute Call" or "Schedule a Discovery Call."
• High-ticket businesses: "See Recent Projects" or "Read Case Studies" — sometimes the right first step is education, not a form.

A secondary action can exist (a phone number, a "see pricing" link), but it should be visually quieter — a text link, not another big button. The pattern of one loud CTA repeated several times down the page outperforms three competing CTAs almost every time, which is why we use it on every landing page we build for clients running paid traffic.

Where Social Proof Belongs in the Hero

Social proof in the hero should be small, specific, and supporting — not the main event.

Useful patterns:

• A star rating with a real review count, linked to the source ("4.9 stars, 217 Google reviews").
• A logo strip of recognisable clients, in grayscale, with a short caption ("Trusted by businesses across Calgary").
• A specific outcome from a real customer, kept short ("Saved us $640 on our last move — Sara, Inglewood").
• A single award or certification badge if it is meaningful in your industry.

The mistake most homepages make is dumping a wall of testimonials below the fold and treating the hero as a "no proof" zone. Visitors want proof at the moment they are deciding, which is right next to the headline and the button, not three scrolls away.

The Baymard Institute's e-commerce research on trust elements translates almost directly to service businesses: trust signals work hardest when they are placed near the action they are meant to support, not segregated to a "Reviews" section the visitor will never reach.

What to Leave Below the Fold

Almost everything else. The detailed services list, the long About story, the full testimonials wall, the FAQ, the team grid, the blog teaser, the partner logos, the newsletter signup — these all belong on the homepage. They do not all belong above the fold.

A useful structural rule: the hero answers "should I keep reading?" The next section answers the most pressing follow-up question, which is usually one of:

• What exactly do you do? (services overview)
• Who is this for? (audience or "ideal customer" framing)
• How does it work? (three- to five-step process)
• What does it cost? (pricing or pricing range)
• What have you done before? (recent projects or case studies)

The right second section depends on the audience. A high-trust, high-consideration purchase (like a kitchen renovation) usually wants "How it works" or "Recent projects" next. A low-friction service (like dog walking) usually wants "Book a slot" or pricing. The point is that the second section is chosen, not defaulted into.

A Word on the Hero Image

The single biggest visual mistake on service business homepages is the hero image, and it almost always falls into one of three categories:

• A stock photo of a team that does not exist.
• A photo so abstract or stylised that it carries no information.
• A video that auto-plays with sound off, half a second of buffering, and a play button overlay no one taps.

The replacements are not glamorous. They work anyway:

• A real photograph from a recent job, properly sized and compressed.
• A photo of the actual team or owner, taken in the actual workspace.
• A short, silent, looping video of the work being done — three to five seconds, optimised for mobile, with a static fallback for slow connections.
• A diagram or illustration that explains the offer at a glance, if photography is not realistic.

Performance matters here too. A heavy hero image is the most common cause of a slow Largest Contentful Paint, which Google measures as part of Core Web Vitals. A homepage that takes four seconds to render its hero is a homepage that has already lost a chunk of its visitors before they read the headline. We cover this in more depth in our Core Web Vitals guide for 2026.

Test the First Screen Like It Is the Whole Page

Once the hero is built, test it the way it will be used.

• Show it to three people for five seconds and ask them what the company does.
• Open it on a mid-range Android phone on cellular and time the load.
• Check that the primary CTA is fully visible without scrolling on a 13-inch laptop, on an iPhone SE, and on a Pixel 7.
• Look at the heatmap or scroll map after thirty days to see whether visitors are reaching the second section.

If the answers to the five-second test are vague, the headline is wrong. If the load is slow, the image is too heavy. If the CTA is below the fold on common screen sizes, the hero is too tall. If visitors are not scrolling past the hero, either the hero is doing its whole job (good) or it is failing to invite them to keep going (bad). The tracking will tell you which.

A Practical Action List

If your homepage hero needs work, the first pass is short:

• Rewrite the headline to finish the sentence "We do ___ for ___ in ___."
• Add a one-line qualifier underneath that handles the obvious follow-up question.
• Pick one primary action and make it the most visible thing on the screen.
• Replace the stock photo with a real photograph from real work.
• Add one piece of proof — a star rating, a logo strip, or a specific quote — next to the CTA.
• Confirm the whole thing renders in under two seconds on a mid-range phone.

Once the hero is doing its job, the rest of the homepage gets to do its job too. The first screen is not the whole sale, but it is the gate. If you want a second pair of eyes on yours, get in touch — most service business homepages can be meaningfully improved in a single focused pass, long before anyone needs to talk about a redesign.