Image size for website speed: the fix

Image size for website speed is the single most common reason a small business site feels sluggish, and it is also the easiest thing to fix once you know the numbers. Most owners do not have a coding problem. They have a photo problem: full-resolution camera shots uploaded straight onto a page, doing far more work than the screen will ever display.

📸 Why photos wreck page speed more than anything else

A modern phone camera produces images of 8MB or more, sized for printing a poster. A website only needs to show that image at a few hundred pixels wide on most screens. Upload the original file without resizing it first, and the browser has to download the full poster-sized version just to shrink it down on screen. That download is where the delay happens.

On a typical small business page, images make up the majority of everything the browser has to load, often well over half the total weight of the page. A single oversized hero photo at the top of a homepage can be larger than every other element on that page added together. Visitors on a decent office wifi connection might not notice. Visitors on their phone, on 4G, standing outside a gym or a holiday let deciding whether to book, absolutely will.

📏 The actual numbers to work to

Forget vague advice to "compress your images" without a target. These are the practical ranges that keep a page fast without the photos looking muddy:

• Landscape or banner images (hero photos, gallery shots): no wider than 2,500px, aiming for a file size of 400 to 500KB.
• Portrait or general content images (team photos, product shots): no wider than 1,500px, same file size target.
• Logos: keep the file as small as possible, saved as a PNG so the background stays transparent.

Format matters too. JPG is still the right choice for photographs. PNG is for logos, icons and anything needing a transparent background, not for photos, because it produces much larger files for the same image.

The mistake worth calling out specifically: resizing an image using the width and height settings in your page editor, or in the HTML itself, does nothing for file size. It only changes how large the image displays. The browser still downloads the full original file in the background. The resize has to happen to the actual file, before it gets uploaded, using an image editor or a free compression tool.

🖼️ Where it actually matters most on the page

Not every image on a site deserves the same attention. The photo that loads first, usually the hero image above the fold before anyone scrolls, has the biggest effect on how fast the page feels, because it is the first thing a visitor's eyes land on. Get that one wrong and the whole site feels slow even if everything below it is fine.

Galleries are the other usual culprit. A gym class page or a holiday let listing with thirty photos will often load every single one the moment the page opens, including the twenty-five a visitor never scrolls down to see. Lazy loading, where images further down the page only load once the visitor scrolls near them, fixes this without needing to touch the photos themselves.

✅ A quick checklist before you upload

Before adding any new image to a website:

1. Resize it to the dimensions above, not just squeeze it into a smaller box on the page.
2. Save it as a JPG at 400 to 500KB, using a free compression tool if needed.
3. Give the file a proper, descriptive name (seaside-cottage-kitchen.jpg, not IMG_4821.jpg).
4. Add short, accurate alt text describing what's in the image.

That last step does double duty: it helps anyone using a screen reader, and it gives search engines useful context about the page.

🛠️ What it means for the rest of the site

Fixing image size for website speed on its own can shift a page from feeling sluggish to feeling instant, and it is worth doing before touching anything else, since bloated hosting upgrades or plugin audits will not fix a page weighed down by 5MB of photos. But it only stays fixed if whoever manages the site keeps uploading images the right way afterwards, which is where a lot of small sites slide back into the same problem six months later.

This is one of the things a £95/month care plan is actually for at WebCheap: new images get resized and compressed properly before they go live, rather than left for a future audit to catch. If it is a one-off clean-up of an existing site's photo library, that is a straightforward batch of changes at £25 a go, usually sorted in a single afternoon.