1. Resize before you compress
A 4000-pixel camera image is wasteful when it appears at 900 pixels on a page. Reducing pixel dimensions usually saves more data than aggressively lowering quality. Keep a high-resolution master elsewhere, then create a delivery copy sized for the intended layout.
For responsive pages, consider multiple sizes so small screens do not download desktop-sized assets. Avoid upscaling a source image because adding pixels does not restore missing detail.
2. Match the format to the content
Photographs usually respond well to lossy WebP, AVIF, or JPEG compression. Logos, icons, screenshots, and illustrations with sharp text may need lossless settings or careful comparison. Transparency requires a format that supports an alpha channel, such as PNG, WebP, or AVIF.
3. Find the quality threshold
Quality sliders are not standardized across formats, so a value of 80 in one encoder is not identical to 80 in another. Begin around a balanced setting, inspect important details, and lower quality gradually until artifacts become noticeable. Then move slightly back toward higher quality.
- Inspect faces, hair, and skin gradients.
- Check small text embedded in screenshots.
- Look for color banding in skies and shadows.
- Review high-contrast edges for halos or blocks.
4. Remove metadata when it is unnecessary
Camera files can include capture settings, device details, thumbnails, and location data. Removing metadata can reduce size and protect privacy. Retain copyright or color-management information when your workflow depends on it.
5. Judge quality at the final display size
An artifact visible at 400% zoom may never appear in the actual layout. Conversely, a thumbnail that looks fine can reveal problems when opened full size. Review the output at both 100% and its intended on-page dimensions.
Compression checklist
- Keep the original file as a master.
- Resize a copy to the largest required display width.
- Choose a suitable format.
- Apply moderate quality compression.
- Remove unneeded metadata.
- Compare appearance and file size.
- Test the final page on a phone and a slower connection.
Frequently asked questions
Does compressing an image always reduce quality?
Lossy compression discards some information, but moderate settings can make the visual difference difficult to notice. Lossless compression reduces size without discarding image data.
Why is my compressed image still large?
Its pixel dimensions may be oversized, the content may be difficult to compress, or the selected format may not suit the image.
Should I compress an image more than once?
Avoid repeated lossy recompression. Return to the best available original and create a fresh optimized copy.
Create a smaller delivery copy
Resize, adjust quality, and export multiple images locally in your browser.
Open the free optimizer