Cussons Media Website Mockup

A picture may be worth a thousand words, but online that only holds true when your images have been properly optimised.

Too many businesses do not realise the impact of simply throwing an image onto their website without optimising it first. Images usually account for the majority of the bytes a page has to download, so they can dramatically affect how your site performs.

This guide covers both halves of the story: why website image optimisation is vital, and exactly how to do it. Let us start with why it matters.

Contents

Why website image optimisation matters

Optimising your images is one of the highest-value, lowest-effort things you can do for your website. Here is why it is worth the small amount of attention.

Why it matters The payoff
First impressions Images shape the instant a visitor judges your site
Speed Avoid the bounce from slow, heavy pages
SEO Faster pages and image search both lift rankings
Conversions Faster, better pages convert more

First impressions. When a page loads, the design and imagery are usually the first things a visitor takes in, and they form an instant impression of your website. Poor-quality images, or a slow-loading page, can be enough to send a potential customer straight back to the search results, which is part of getting your web design right.

Speed. Unoptimised images are one of the most common causes of a slow website, and speed is everything. More than half of visitors abandon a page that takes longer than about three seconds to load, so if your crisp, high-resolution images are costing you speed, the price is too high. The good news is you can shrink images dramatically without a visible drop in quality, as we cover in our guide to website performance.

SEO. Google factors page speed and experience into its rankings through Core Web Vitals, so slow, heavy images quietly cost you visibility. Optimised images help you rank, and well-named images with alt text can appear in image search too, both of which feed your organic SEO.

Conversions. It follows naturally: faster, better-performing pages convert more visitors into customers. Speed, SEO and conversions all move together, and images are one of the biggest levers on all three. Amazon famously estimated that even a one second delay could cost it billions in sales, a useful reminder of just how much speed is worth.

Choose the right file format

Now for the how. The first decision is format, and choosing the right one for each image makes a real difference. The old trio of JPG, PNG and GIF still exists, but modern formats now do the job better.

Format Best for Notes
JPG Photos, product images, banners Adjustable quality, no transparency
PNG Transparency, simple graphics Larger files, long used for logos
WebP Photos and graphics (modern default) Smaller than JPG and PNG, widely supported
AVIF Photos needing the smallest size Excellent compression, newer format
SVG Logos and icons Vector, sharp at any size, tiny files
GIF Simple animation Limited colour and quality

A quick rundown. JPG (or JPEG) is still the old faithful for photographs, product shots and hero banners, with adjustable quality so you can balance file size against sharpness. PNG handles transparency well, which is why it was long the go-to for logos, though it produces larger files for photos. GIF has a limited colour range and quality, so it is really only suited to simple animation now.

The newer formats are where the real gains are. WebP and AVIF deliver the same visual quality as JPG and PNG at much smaller file sizes, and they are now supported across all modern browsers, so they should be your default for photos and graphics wherever you can use them. And for logos and icons, SVG is the best choice of all: it is a vector format, so it stays razor sharp at any size while weighing almost nothing.

Compress and resize your images

Whatever the format, file size is the single thing that matters most for speed, so always compress and resize before uploading.

Resize to the right dimensions. Never upload an image larger than it will be displayed. A photo shown at 800 pixels wide does not need to be 4000 pixels wide, that is just wasted weight. While you are at it, set each image’s dimensions so the page does not jump around as it loads, which keeps your layout stable and is one of Google’s Core Web Vitals.

Compress the file. Reduce the file size without a visible loss of quality. Most design tools have an “export for web” option, and there are excellent free tools, such as Squoosh or TinyPNG, that do it in seconds. On WordPress, image optimisation plugins can compress your images and convert them to WebP automatically as you upload.

Serve the right size per device. Modern websites use responsive images to send a smaller file to a phone than to a desktop, which matters because most visitors are on mobile, as we cover in responsive website design. And do not forget thumbnails: they are the silent killer, so small you assume they do not matter, but they add up, so keep them as light as possible. A well-built website handles much of this for you behind the scenes.

Name your images well

It is tempting to upload images straight off your camera with names like IMAGE01.jpg, but that does you no favours. For a start, it becomes near impossible to find the right image later in a long list of camera-generated file names.

More importantly, descriptive and keyword-relevant filenames (think blue-ceramic-coffee-mug.jpg rather than DSC_0042.jpg) help your images show up in Google image search. Since those results link back to your website, they can bring in extra traffic. It is a tiny habit that quietly supports your SEO.

Use alt text

Some people call alt text the single most important part of image optimisation, and it does double duty. First and foremost it is an accessibility feature: the alternative text describes an image for people using screen readers, and it is what shows if the image fails to load.

It also adds SEO value, helping search engines understand what your images show. Write alt text that clearly and naturally describes the image, including a relevant keyword where it naturally fits, but do not stuff keywords in, as that helps no one and can work against you. Carefully chosen alt text is good for your visitors and good for your rankings, a rare and welcome win-win.

Frequently asked questions

What is website image optimisation?
Website image optimisation is the process of preparing images so they load quickly without an obvious loss of quality. It involves choosing the right file format, compressing and resizing images, naming them well, and adding alt text. The goal is faster pages, better SEO and a stronger experience, all without your images looking any worse.

Why is image optimisation important?
Because images are usually the heaviest part of a web page, so unoptimised ones slow your site down. That hurts first impressions, drives visitors away, lowers your Google rankings through Core Web Vitals, and reduces conversions. Optimising images is one of the simplest, highest-impact ways to improve your website’s speed and performance.

What is the best image format for websites?
For most photos and graphics, WebP or AVIF are the best modern choice, offering the same quality as JPG or PNG at much smaller sizes. Use JPG for photos where those are not available, PNG when you need transparency, and SVG for logos and icons since it stays sharp at any size. GIF is now really only for simple animation.

How do I reduce image file size without losing quality?
Resize the image to no larger than it will be displayed, then compress it using an “export for web” setting or a free tool like Squoosh or TinyPNG. Choosing a modern format like WebP helps too. On WordPress, an image optimisation plugin can compress and convert your images automatically as you upload them.

What is alt text and why does it matter?
Alt text is the alternative text attached to an image. Its main job is accessibility, describing the image for people using screen readers and showing if the image fails to load. It also helps search engines understand your images, adding SEO value. Write clear, natural descriptions with a relevant keyword where it fits, without stuffing keywords.

Do image file names affect SEO?
Yes, modestly. Descriptive, keyword-relevant file names help search engines understand your images and improve your chances of appearing in Google image search, which can drive extra traffic to your site. Names like product-name.jpg are far better than camera defaults like DSC_0042.jpg, both for SEO and for keeping your image library manageable.

Read more: How fast should my website load?