How to Optimize Images for Website Speed and Core Web Vitals

Google's Core Web Vitals put a hard number on how fast and stable your pages feel, and images influence nearly all of it — largest contentful paint, layout shift, and overall load time. Optimising images well can move these scores from failing to passing, improving both user experience and search visibility. But it takes more than running everything through a compressor.

This guide is a complete checklist for image performance: sizing, formats, compression, lazy loading and stability, with the conversion steps handled by free browser-based tools.

Size and format: the foundation

The two biggest wins are serving images at the right size and in the right format. An image should be no larger in dimensions than the space it fills, so resize each one to its display size — ideally providing appropriately sized versions for mobile and desktop. Then convert photos to WebP for a smaller file at the same quality.

Use the ConvertProKit Image Resizer and JPG to WebP Converter for these steps. Getting size and format right typically accounts for the majority of the total savings, before any compression is applied.

Compression and the largest contentful paint

Your largest contentful paint (LCP) is usually a hero image or the biggest visible image on load. Because it directly determines a key Core Web Vitals metric, it deserves special attention: size it precisely, use an efficient format, and compress it enough to load fast without visible artefacts.

Run your key images through the ConvertProKit Image Compressor at a moderate level. A lean LCP image loads sooner, which improves the metric and makes the page feel instant. Everything below the fold matters less for LCP but still benefits from the same treatment.

Lazy loading and layout stability

Two techniques finish the job. Lazy loading defers off-screen images until the user scrolls near them, so the initial load only fetches what is visible — a big speed win on long pages. Modern browsers support this with a simple loading attribute on image tags.

To protect your cumulative layout shift score, always specify each image's width and height (or use CSS aspect-ratio) so the browser reserves the right space before the image loads. This stops content from jumping around as images arrive. Combine optimised, well-sized, correctly-attributed images with lazy loading and your Core Web Vitals will reflect it.

Step-by-step guide

Quick answer

How do images affect Core Web Vitals? Images influence largest contentful paint (load speed) and cumulative layout shift (stability). Optimising them improves both scores directly. In short, the Image Compressor lets you handle image compressor for free, directly in your browser, with your files staying private on your own device the entire time.

Common use cases

People turn to image compressor for all sorts of everyday reasons. If any of these sound familiar, the Image Compressor is built for exactly your situation:

• Speeding up a slow web page that is weighed down by heavy images.
• Getting a batch of photos small enough to attach to an email.
• Freeing up storage space taken by unnecessarily large image files.
• Meeting an upload size limit on a form, marketplace or portal.
• Improving Core Web Vitals scores by shipping lighter images.

Whatever brought you here, the process is the same — quick, free and handled entirely on your own device — so you can get the result you need and move on.

Free ConvertProKit tools for this workflow

Everything in this guide is powered by free tools that run entirely in your browser — nothing is uploaded, there is no signup, and there are no watermarks or limits. These are the ConvertProKit tools that work best alongside the Image Compressor for image compressor:

• Image Compressor — cut image file sizes by up to 80% while keeping them sharp.
• Image Resizer — set exact pixel dimensions for the web, social media or print.
• JPG to WebP Converter — compress JPGs into smaller WebP files for faster pages.
• PNG to WebP Converter — keep PNG transparency at a fraction of the file size.

Because each one processes files on your own device, you can chain them together — for example convert, then resize, then compress — without a single file ever leaving your computer. That combination of speed and privacy is the whole point of a browser-based toolkit: there is no upload to wait for, no queue, and no server holding a copy of your data afterward.

All of these tools are part of the wider ConvertProKit collection of free online utilities, so once you are set up for image compressor you have dozens of related image, PDF, text and productivity tools a click away — every one of them free, private and instant, with nothing to install and no account to create.

Tips to get the best results

A few habits make image compressor smoother and keep your results consistently high quality. Keep these in mind whenever you use the Image Compressor:

• Resize an image to its display dimensions before compressing — it is the single biggest saving available.
• Use moderate compression, not the maximum, to keep images sharp while still cutting the file size.
• For photos, WebP gives the best size-to-quality ratio; reach for it when the platform supports it.
• Preview the compressed image before downloading to confirm it still looks crisp at the size you need.

None of these take extra effort once they become routine, and together they are the difference between a result that is merely acceptable and one that is genuinely polished.

Common mistakes to avoid

Most problems with image compressor come down to a handful of avoidable slip-ups. Steer clear of these and you will get a clean result the first time:

• Compressing without resizing first, leaving the biggest saving on the table.
• Pushing compression to the maximum and introducing visible artefacts.
• Using the wrong format, so the file stays larger than it needs to be.
• Re-compressing an already-compressed image instead of starting from a good source.

The good news is that every one of these is easy to sidestep once you are aware of it. Take a moment to work from a good original, choose the right settings, and use a tool that keeps your files on your device, and the whole process becomes reliable rather than hit-or-miss. If something does not look right, it usually costs only a few seconds to adjust a setting and run it again — another advantage of doing everything instantly in your browser rather than waiting on a server round-trip.

Is it free and private?

Yes on both counts. The Image Compressor is completely free — no account, no subscription, no watermark and no cap on how many times you can use it. More importantly, it is private by design: the work happens inside your browser using your own device, so your files are never uploaded to a remote server. When you close the tab, nothing is left behind anywhere but on your own machine, which is exactly what you want when image compressor involves anything personal or confidential.

This is a genuinely different model from most "free" online tools, which upload your file to their servers, process it there, and ask you to trust that they delete it afterward. With a browser-based tool there is nothing to trust and nothing to delete, because your data never travelled anywhere in the first place. That is why ConvertProKit can offer these tools free forever without limits — there is no per-file server cost to recover — and why you can use them with sensitive documents and personal photos without a second thought.

Frequently asked questions

The bottom line

Optimising images for speed is a checklist, not a single action: size correctly, convert to WebP, compress the important images, lazy-load the rest, and lock in dimensions to prevent shift. Work through it and your Core Web Vitals — and your visitors — will thank you. The conversion and compression steps are free in your browser.