Compress Images for a Faster Website (Free)
On most sites, images are the majority of the page weight β and the easiest thing to fix.
Open almost any slow page, look at what it downloaded, and images will be most of it. Not the framework, not the fonts β the pictures. Which is good news, because unlike a rendering bottleneck, oversized images are fixable in an afternoon with no code changes.
Serve the size you actually display
The most common waste by far is a 4000px photo displayed in a 600px column. The browser downloads every one of those pixels and then throws most of them away. Resize each image to roughly the width it is displayed at β double it if you want it crisp on high-density screens β and you will often cut the file by 90% before compressing at all.
Then compress
With the dimensions sensible, run each image through the compressor and pull the quality down while watching the size. For photographs on a web page, the point where quality loss becomes visible is much lower than people expect β most of the way down the slider still looks clean at display size.
Use WEBP where you can
WEBP typically gives a noticeably smaller file than JPG or PNG at comparable quality, and it supports transparency. Browser support has been universal for years. The converter switches between JPG, PNG and WEBP, so converting a set of hero images to WEBP is often the single biggest remaining win.
Why this shows up in Core Web Vitals
Largest Contentful Paint is usually a hero image. If that image is 3 MB, LCP is bounded by how long 3 MB takes on the visitor's connection β and on mobile data that is the whole problem. Getting the hero to a couple of hundred kilobytes tends to move the metric more than anything else you can do without touching code.
Compress your images now β free
Resize, compress, convert to WEBP. All three run in your browser with no watermark and no limits.
