Your Homepage Is Carrying Extra Luggage: A Practical Image Diet for UK Small Firms
Most small business homepages do not fail because the design is ugly. They struggle because the page is heavy. A single photograph pulled straight from a phone or a stock library can arrive at 2MB, 4MB or more, and every visitor pays for it in waiting time. On a laptop in the office it feels fine. On a phone in a queue, on a train, or on a patchy 4G signal near the back of a shop, it feels like a broken website.
That is the odd thing about image weight: it is invisible to the person who built the site and very visible to the person trying to use it. The photo looks sharp on a big screen, so nobody questions it. Meanwhile, a customer is watching a blank space where your opening image should be.
The weight is invisible until it is not
A 2MB image is not just a number in a media library. It is a queue. The browser has to download it, decode it and then squeeze it onto a screen that may be only a few hundred pixels wide. If your homepage has a hero photo, three service images and a logo, the total can climb quickly. Add a web font, a tracking script and a map embed, and a page that looked simple in the design file becomes a small endurance test on mobile.
This matters in 2026 because more UK customers than ever are browsing on phones, often on connections that are good but not perfect. They are not sitting on your office Wi-Fi. They are in a car park, on a bus, in a cafe with one bar of signal, or on a train that has just entered a tunnel. Your homepage has a few seconds to reassure them. Heavy images spend those seconds doing nothing useful.
The answer is not to strip all the personality out of your site. A homepage with no photographs can look like a directory listing. The aim is to keep the warmth and lose the excess baggage.
A simple before-and-after test
You do not need a developer console to see the problem. Start with the device your customers actually use.
- Pick up your phone and turn off Wi-Fi so you are on mobile data.
- Open a private browsing tab or clear the site cache so you are not loading a saved copy.
- Load your homepage and watch it as a customer would. Note how long the main image takes to appear and whether the page jumps around as things arrive.
- Make a note of the largest image on the page. Your content management system or image library will usually show the file size.
- Resize and compress that one image, upload it, and repeat the test on the same phone and connection.
You are looking for a noticeable improvement, not a laboratory score. If the page feels quicker and the image still looks right at normal viewing size, you have won. Tools such as PageSpeed Insights can give you a second opinion, but your own phone in a normal location is a useful reality check.
Formats in plain English
Most SMEs have heard of JPEG and PNG, then glaze over at WebP and AVIF. The short version is this: the format is the container, and some containers pack the same picture into a smaller parcel.
JPEG is still fine for photographs. It has been around for decades and every browser understands it. PNG is better for logos, icons and graphics with flat colours or transparency, but it is usually a poor choice for large photos because it can be surprisingly heavy.
WebP is the sensible everyday upgrade for most business websites. It handles photographs well, supports transparency, and is widely supported by modern browsers. AVIF can go smaller again, particularly on large photographic images, but it is worth testing on older devices and checking that your image quality still holds up. For a small firm, the practical move is often WebP as the default, with JPEG as a fallback if your setup needs one.
Do not convert everything blindly. A flat logo with two colours may be better as an SVG. A product photo with fine detail may need careful compression. The format is a tool, not a badge of honour.
Resize first, compress second
This is where many image problems begin. A photo straight from a modern phone might be 4000 pixels wide. If it appears on your homepage in a box that is 600 pixels wide on a laptop and 350 pixels wide on a phone, most of those pixels are wasted. The browser still has to download them before it can throw them away.
Start by resizing the image to something close to its largest display size. As a rough guide, a full-width hero image might be 1600 to 2000 pixels wide. A card or service image might be 800 to 1200 pixels. A small thumbnail might be 400 to 600 pixels. These are not strict rules, but they stop you uploading a billboard image for a postage-stamp space.
Then compress. A quality setting around 70 to 80 is often a good starting point for photographs. Check faces, text and smooth gradients at the size the image will actually appear. If you are squinting at 400% zoom to find a problem, your customers probably will not see it either. If a face looks blotchy or a logo looks fuzzy at normal size, ease the compression back a little.
Serve images like you mean it
Good image files are only half the job. The way they are served matters too. If your website supports responsive images, use them so smaller screens can receive smaller files. Lazy loading is useful for images further down the page, but avoid lazy-loading the main hero image; that is often the first thing a customer needs to see. Keep caching switched on and make sure your host is not serving a full-size original every time someone visits a category page.
It also helps to stop using images for things that should be text. A photograph of your phone number is not accessible, cannot be read by search engines properly, and will look fuzzy when someone zooms in. Use real text and style it.
A house rule checklist for future uploads
Most image problems come back because nobody sets a standard. A simple checklist in your content process is worth more than a one-off clean-up.
- Resize the image to its real display size before uploading.
- Export as WebP where possible, with JPEG as a sensible fallback for photos.
- Aim for a hero image under roughly 200 to 250KB and card images under 100KB where quality allows.
- Use descriptive file names and proper alt text, especially for product and service photos.
- Test the page on a phone with Wi-Fi switched off at least once a month.
- Keep the original high-resolution file in a separate folder in case you need it for print or a campaign.
- Delete unused images from the media library so nobody accidentally reuses a 6MB photo from 2023.
- Look at total page weight, not just one image. Five slightly heavy images can add up to the same problem as one enormous one.
The quality question is the one that worries most business owners. Will compression make the site look cheap? Bad compression can, yes. But a sensibly resized WebP at a moderate quality setting often looks better on a phone than a giant JPEG that the browser has to shrink in a hurry. The trick is to judge the image at the size it appears on the page, not at full zoom on a desktop monitor.
Your homepage should feel welcoming, not heavy. Treat images like luggage: take what you need, pack it properly, and leave the rest at home. A lighter page is not a less attractive page. It is a page that gets out of the customer's way.