How to Compress Images for a Website

Images are usually the heaviest part of a web page. Compressing them is one of the highest-impact changes you can make to improve page speed, Core Web Vitals, and your search ranking. Here's the full process.

Step 1: Choose the right format

Pick the format based on the image. Use JPG for photos, PNG for graphics that need transparency, and WebP for almost everything else — it's smaller than both and supported by all modern browsers.

Step 2: Resize to what you actually need

Don't serve a 4000px image in a 600px slot. Resize images to the largest display size you use, accounting for retina screens (roughly 2× the CSS size).

Step 3: Compress

Run each image through the image compressor. For photos, a quality of 70–80 is usually visually identical but far smaller. For a site with many images, use the batch compressor and download a ZIP.

Step 4: Test your page speed

After compressing, re-test your page with a tool like PageSpeed Insights. Watch your Largest Contentful Paint and total page weight — both should improve.

Frequently asked questions