Most first visits happen on a phone, between other things. If the headline and the next step are late, the visitor is already back on the search result underneath yours.
Measure the first screen, not a laptop score
Look at the largest thing on the home page as a person on a mid-range Android would see it. A hero video, an uncompressed photograph, and three marketing scripts will lose to a page that paints the headline, one proof, and one action. Compress images, drop the scripts you cannot name, and keep the font files small enough that the text does not arrive after the layout.
The next step has to be obvious
A site can be attractive and still fail if the visitor cannot tell whether to call, write, or start a request. Put that action where the thumb is, and repeat it after the proof. Secondary pages — services, work, a single case — should answer one question and point back to the same action.
Edit the title for the search you want
The title and the first paragraph should say the work in the words a buyer uses: software, an API, a website, an agent. A clever line that hides the offer makes the page harder to find and harder to understand. Write the title for the query, then make the page keep the promise.
A budget for the first screen
Write the budget before the design grows. On a first visit over a slow phone connection, the document, the CSS you actually use, and the image in the first screen should fit in a few hundred kilobytes, not a few megabytes. A hero video is a second page. It does not belong in the path that has to paint the headline.
Set the width and height of every image in that first screen so the text does not jump when the file arrives. Use one font family for the heading and the body, with the weights you really use. A page that waits on four font files is a page whose headline is invisible.
Open the page with the cache disabled and the network slowed, and watch the headline. If a script you cannot name is on the critical path, remove it. Analytics can load after the visitor can already read the offer.
A pass we actually run
Load the home page on a mid-range phone, on the network you get away from the office, and time the moment the headline is readable. Write that number down. Then look at the transfer size of the document, the stylesheet, the font, and the largest image. Those four numbers are the review. A lighthouse score without them is a distraction.
The action has to be tappable without zooming, and it has to say what happens next. “Start a request” is a next step. “Learn more” is a delay. Repeat the same action after the proof, because some visitors decide at the headline and some decide after they have seen the work.
Service pages follow the same rule. One offer, the words a buyer would type, one proof, and the same action. A page that tries to explain the whole company will lose to a page that explains the one job the visitor came to buy. Link between those pages with the name of the destination, so the index and the visitor both know where they are going.
Write the result of the pass in the ticket that changes the page: the headline time, the four sizes, and the one file you removed. The next person should not have to rediscover that the font was the delay. A performance note that only says “optimised the site” is not a note.
On the next pass through the home page
- Open the home page on a phone over a slow connection and wait for the headline.
- Cut one script or one image that does not help the first decision.
- Make the primary action the same on the home page and the service page.
