How to convert and optimise images for websites

Order of operations

1. Crop and compose in an editor if the subject is off-centre.

2. Resize to the largest size the layout will display, times 2 if you need retina and can afford it.

3. Compress with a quality you can actually see.

4. Strip metadata unless you have a reason to keep it.

What we tested

A 2400×1600 JPEG was resized to 1200×800, then compressed at quality 0.8. The byte count dropped far more from the resize than from a quality tweak on the original 2400-pixel file. That matches the comparison page on compression versus resizing.

Social images

Open Graph defaults to 1200×630 in ConvertPass’s social resizer. Platforms re-compress. Keep text large and away from edges. Test with the platform debugger — ConvertPass does not crawl your site.

Limitations

Browser canvas is not ImageMagick. Colour-managed print work does not belong here. Animation does not belong here.