Large image files slow pages, eat bandwidth and frustrate visitors on slow connections. Here are seven techniques to make them smaller, roughly in order of impact.
1. Resize to display dimensions
Reducing a 4000px image to the 1000px it is actually shown at can cut the file to a fraction of its size. Start here.
2. Convert to a modern format
WebP and AVIF pack the same image into far fewer bytes than JPG or PNG. Converting is often the easiest big win.
3. Lower the quality setting
Dropping JPG/WebP quality from 100 to around 80 removes weight the eye won't miss. This is a slider, so tune it to taste.
4. Strip metadata
EXIF data, GPS coordinates and embedded thumbnails add bytes and leak information. Remove them for smaller, more private files.
5. Reduce the colour palette (for graphics)
Flat graphics, icons and simple illustrations often look identical with a limited palette. An 8-bit PNG can be much smaller than a 24-bit one with no visible change.
6. Vectorise simple graphics
Logos and icons made of flat shapes can become SVG files — tiny, and infinitely scalable. A vector logo can be a fraction of the size of its PNG equivalent.
7. Lazy-load and defer
You can't always make a file smaller, but you can avoid loading it until it's needed. Lazy loading reduces the effective weight of a page even when the individual files stay the same.
Which to use?
For photos: 1 → 2 → 3 → 4. For graphics: 5 → 6, plus lossless optimisation. For whole pages: layer 7 on top. Combined, they routinely cut total image weight by more than half.