How to optimise images for a faster website
If your website is slow, there's a very good chance images are the main reason. They're the heaviest thing on most pages, and they're also the easiest to fix. Optimising images is often the single biggest speed improvement you can make, and much of it is straightforward. Here's how it works and what to do.
Why images slow sites down
A photo straight from a phone or camera can be several megabytes — far larger than it needs to be on a web page. Load a handful of those and the page crawls, especially on mobile data. Because visitors leave slow pages, oversized images quietly cost you customers. The good news: a properly optimised image can look identical at a fraction of the size.
The four things that matter
- Compression — shrink the file size without visible loss of quality. Big savings, no downside.
- Right dimensions — don't load a 4000px image into a 400px space; resize it to what's actually shown.
- Modern formats — WebP and AVIF are far smaller than old JPEG/PNG for the same quality.
- Lazy loading — only load images as they're about to come into view, so the page shows faster.
How to do it
- Before uploading, resize images to roughly the size they'll display at.
- Compress them — free tools like TinyPNG or Squoosh do this well.
- Serve WebP or AVIF where possible; modern sites and CMSs can do this automatically.
- Enable lazy loading so off-screen images don't hold up the first view.
Getting it done automatically
On a well-built site, most of this happens for you — images are automatically compressed, resized for each device and served in modern formats, so you can upload a normal photo and the site handles the rest. If yours doesn't, plugins (on WordPress) or a developer can set it up. It's one of the highest-return pieces of performance work there is.
Common questions
Why are images slowing down my website?
Because they're usually the heaviest part of a page, and photos straight from a phone or camera are far larger than a web page needs. Oversized, uncompressed images make pages slow to load — especially on mobile — and slow pages lose visitors. Resizing, compressing and using modern formats fixes it.
What is the best image format for websites?
For most photos, WebP or AVIF — they're significantly smaller than traditional JPEG or PNG at the same visible quality. Modern browsers support them widely, and a good site serves them automatically with a fallback. Using them is one of the simplest ways to cut page weight.
What does lazy loading mean?
Lazy loading means images only load as they're about to scroll into view, rather than all at once when the page opens. That lets the visible part of the page appear faster, which improves both perceived speed and Core Web Vitals. Most modern sites and CMSs support it easily.
Do I need to optimise images myself?
On a well-built site, no — it should compress, resize and convert images automatically when you upload them. If your site doesn't, you can optimise images before uploading with free tools, use a plugin, or have a developer set up automatic handling. Either way, it's worth doing — it's a big, easy speed win.
Let's talk
Let's talk about your project.
Whether you've got a clear brief or just an idea, tell us what you have in mind and we'll give you an honest recommendation — even if that's a smaller project than you expected.