The First Screen of a Service Business Site on a Phone

The first screen of a service business site on a phone needs five things and very little else: a headline that says what you do, the towns you work in, a phone number that dials when tapped, one button for a quote or a booking, and one piece of proof a stranger can check, like your Google rating or your license number. If a visitor sees those five before they scroll, they can decide to call you without reading another word.

This article is only about that first screen: the part of the page someone sees on a phone before their thumb moves. What goes below it, section by section, is in our guide on what to put on your homepage.

How little room you have

A phone held upright shows roughly a slim header, a headline of two or three lines, one short line under it, two buttons and the top of a photo. That's the whole first screen. Everything on this list has to fit in that space, at a text size people can read without zooming.

So write it, then check it on a real phone, not on a laptop with the window dragged narrow. Use a smaller, older phone if someone in the family has one. If the call button falls below the bottom edge, something above it has to go.

The five things, top to bottom

What you do, in the words people search

The headline names your trade the way a customer would type it: "Roof repair and replacement," "Furnace and AC repair," "Dog grooming and bathing." Not your slogan, and not "Welcome." If you do several things, lead with the one that brings in most of your work and let the rest wait for the services section further down.

Where you work

Put your towns in the headline or right under it: "Roof repair in Elgin, St. Charles and Geneva." Someone in Geneva who sees their own town knows in a second that you'll come out. If your area is large, name the two or three biggest towns and add "and nearby." Keep the list the same as on your Google Business Profile.

A number people can tap

The phone number, written out in full, as a link that opens the dialer. On a phone, the number belongs on the first screen even when the header already has a small call icon, so people can see it's a local number before they tap. How to write that link and where else to repeat it is in our guide to the tap-to-call link, so we won't go over it again here.

Put your hours right under the number in small type, so people know whether a person will answer right now.

One button for a quote

Next to the call button goes one second button, for the people who'd rather not call: "Get a free estimate," "Request a visit" or "Book a time." One button, not five. A first screen that offers Call, Email, Quote, Book and Chat makes people stop and choose, and the call button gets lost in the row.

Pick the button for how your jobs start. Booking fits fixed services like grooming or a haircut. A quote request fits jobs you need to see first, like a roof or a remodel. If you're torn, our article on choosing between booking and a request form goes through it trade by trade.

Proof a stranger can check

One line of proof sits under the buttons, in small type. The best kinds are ones the visitor can verify:

Your Google rating and review count, written the way Google shows them, and linked to your profile.
Your license number, if your trade is licensed where you work. Someone about to let you onto their roof or into their electrical panel may look it up.
Insured, if you are, as one plain word next to the license number.
One real photo of your truck, your crew or a finished job, behind the headline or right under the buttons.

Only true things go here. "Licensed and insured" with no license number reads like a slogan. A year you started is fine if it's true. If it isn't, leave it off.

What to keep off the first screen

Anything that pushes those five items down, or covers them:

Popups and full-screen offers. Google's guidance on intrusive interstitials describes them as page elements that "obstruct users' view of the content," and suggests banners that "take up only a small fraction of the screen" instead. A coupon box that covers your phone number the moment the page opens is exactly that.
Sliders and background video. On a phone, the photo or video at the top is usually the biggest thing on the screen. Google's web.dev guide to Largest Contentful Paint explains that this measure "reports the render time of the largest image, text block, or video visible in the viewport," and that "A good LCP value is 2.5 seconds or less." One compressed photo gets there faster than a video or five rotating slides. More on load times in how fast a site should load on a phone.
A big logo. A logo that takes a third of the screen pushes the call button out of sight. Keep the header to one slim bar.
Chat bubbles that sit on top of the call button. If you use chat, move it where it doesn't cover anything.
A list of every service. That's what the menu icon and the services section are for.

Four first screens, written out

Here's what the five things look like as plain text for a few trades. The businesses and phone numbers are made up, and lines like "same-day" only belong on yours if they're true.

Roofer. Headline: "Roof repair and replacement in Elgin, St. Charles and Geneva." Under it: "Leaks, storm damage and new roofs." Buttons: "Call (847) 555-0137" and "Get a free inspection." Proof: license number and Google rating. Photo: a finished roof on a house in the area.
HVAC. Headline: "Furnace and AC repair in Naperville and Aurora." Under it: "Same-day visits, Monday to Saturday." Buttons: "Call" with the number, and "Request a visit." Proof: Google rating and license number where your trade needs one. Photo: your van in a customer's driveway.
Groomer. Headline: "Dog grooming in Arlington Heights." Under it: "Baths, haircuts and nail trims, by appointment." Buttons: "Book a groom" and "Call." Proof: Google rating. Photo: a real dog after a groom, taken by you.
Auto shop. Headline: "Brakes, diagnostics and oil changes in Schaumburg." Under it: "Open today until 6 p.m." Buttons: "Call" and "Book a service." Proof: Google rating, plus certifications if you have them. Photo: your bays with your sign in view.

A first-screen checklist

The headline names your trade in customer words
Your towns are in the headline or the line under it
The phone number shows in full and dials when tapped
Your hours sit next to the number
One second button, matched to how your jobs start
One line of proof people can check: your rating with a link, your license number if your trade needs one
One real photo, compressed, instead of a slider or a video
Nothing covers the screen when the page opens
All of it fits on a small phone without scrolling

Check it with a screenshot

Open your homepage on your phone and take a screenshot before you scroll. That picture is your first screen. Go down the checklist using only the screenshot, not the live page: anything you'd have to scroll to see doesn't count. Do it again after every change to the top of the page, and on a second phone if you can borrow one, since screens differ in size.

To see how your current site holds up, run our free website checker. It looks for a tap-to-call link and a contact form, checks whether the page fits a phone and runs Google's mobile speed test. Or skip ahead: we build the first version of your website free, in 2 days, with all five things on the first screen.