Image compression basics

1) Size comes from two things

Image file size is mostly driven by dimensions (width × height) and encoding (how the pixels are stored). If an image is 4000px wide but you only display it at 1200px, you’re paying a big file-size penalty for pixels nobody sees. The fastest win is usually resizing first, then compressing.

2) Pick the right format

• JPEG: best for photos. Adjust quality to trade size vs. detail.
• PNG: best for logos, icons, screenshots, and transparency. Larger for photos.
• WebP: modern format with great compression for both photos and graphics (where supported).

3) Recommended quality ranges

For JPEG/WebP, a quality range of 60–80 is usually a good starting point for web use. If you see blocky areas (especially in gradients), increase quality slightly. If you can’t see a difference, reduce it until artifacts appear, then move one step back.

4) Common mistakes

• Uploading huge originals and relying on CSS to “shrink” them.
• Saving photos as PNG (often 5–20× larger than needed).
• Recompressing the same JPEG repeatedly (quality degrades each time).

Try it

Use the Image Compressor for quick reductions, and the Image Resizer when dimensions are the main problem.