Image Compression: Quality vs Size Tradeoff Guide 2026

Every website owner, photographer, and content creator faces the same question: how small can I make this image before it looks bad?

The answer depends on the image, the format, and how it will be viewed. This guide teaches you how compression works, how to measure quality, and how to find the perfect tradeoff for any use case.

How Image Compression Works

Image compression reduces file size by exploiting two types of redundancy in image data:

1. Spatial Redundancy

Adjacent pixels in an image are often similar. A blue sky has thousands of nearly identical blue pixels. Compression algorithms group these similar pixels and store them efficiently.

2. Perceptual Redundancy

The human eye is less sensitive to certain types of detail:

High-frequency color changes (small color variations)
Fine texture variations
Subtle brightness gradients

Compression algorithms can discard this “less important” data without visible quality loss.

3. Statistical Redundancy

Some byte patterns appear more frequently than others. Encoding common patterns with shorter codes (Huffman coding, arithmetic coding) reduces file size.

Lossy vs Lossless Compression

Lossless Compression

Reduces file size without any quality loss. Every pixel is preserved exactly. The original file can be perfectly reconstructed from the compressed file.

Examples: PNG, WebP (lossless mode), GIF, FLIF, AVIF (lossless mode)

Typical reduction: 10-30% for photos, 50-80% for graphics with solid colors

Best for: Archival, graphics with text, screenshots, logos

Lossy Compression

Discards some image data to achieve smaller files. The reconstructed image is similar to the original but not identical.

Examples: JPG, WebP (lossy mode), AVIF (lossy mode), HEIC

Typical reduction: 50-90% for photos

Best for: Photographs, web images, email attachments

The Quality Spectrum

Image quality settings (typically 0-100 for JPG) represent a tradeoff between file size and visual fidelity:

Quality	File Size	Visual Quality	Use Case
100	Largest	Identical to original	Archival, print
95	-25%	Imperceptible difference	Professional photo delivery
90	-40%	Barely visible artifacts	High-quality web
85	-50%	Excellent for most uses	Recommended for web photos
80	-60%	Very good	General web use
75	-70%	Good, slight artifacts	Mobile-optimized
70	-75%	Acceptable	Aggressive optimization
60	-85%	Visible artifacts	Thumbnails, previews
50	-90%	Noticeably degraded	Maximum compression

Sweet spot for most uses: 80-85%. This gives 50-60% size reduction with virtually no visible quality loss.

The 80% Rule

In our testing across thousands of images, the quality “sweet spot” is typically 80-85% for JPG:

At 85%, the file is ~50% smaller than the original with no visible quality loss
Below 80%, compression artifacts become visible on close inspection
Above 90%, file size grows significantly with diminishing returns

AmberPic’s Image Compressor uses 80% as the default for this reason.

How to Measure Quality

1. SSIM (Structural Similarity)

The most common perceptual quality metric. SSIM compares the compressed image to the original on a 0-1 scale:

1.0 = identical
0.99+ = imperceptible difference
0.95+ = excellent
0.90+ = good
<0.85 = visible quality loss

2. PSNR (Peak Signal-to-Noise Ratio)

Measures pixel-level differences. Higher is better. PSNR 35+ dB is generally considered good.

3. Buttress / DSSIM

Variations of SSIM used in research and some compression tools.

4. Visual Inspection

The most important measure. View the compressed image on the target device at the target size. If it looks good, it is good.

The “Perceptual” Quality Trick

Modern compression tools (WebP, AVIF, JPG encoders with perceptual optimization) consider how the human eye perceives quality. They allocate bits to areas of the image that the eye notices most, and fewer bits to areas the eye ignores.

This means a perceptually-optimized JPG at quality 75 can look as good as a non-optimized JPG at quality 85, with smaller file size.

Compression by Content Type

Different content compresses differently:

Photographs

Best: JPG, WebP, AVIF (lossy)
Typical reduction: 50-80%
Recommended quality: 80-85%

Graphics with Text

Best: PNG, WebP (lossless)
Typical reduction: 20-50%
Avoid JPG — it creates halos around text

Screenshots

Best: PNG for sharp text, WebP for smaller files
Typical reduction: 30-60%
JPG at high quality works but is larger

Logos and Icons

Best: SVG (vector)
For raster: PNG or WebP (lossless)
JPG is poor for these

Line Art and Illustrations

Best: PNG, WebP (lossless)
Avoid JPG — it creates artifacts on solid colors

Medical / Scientific Images

Best: PNG, TIFF (lossless required)
Never use lossy compression for diagnostic images

Common Compression Mistakes

1. Re-Compressing JPGs

Each save of a JPG re-encodes the image, accumulating quality loss. Always compress from the original, not a previously compressed version.

2. Over-Compressing for Marginal Gains

Compressing from quality 85 to 70 might save 30% more, but the visual difference is noticeable. Find the balance.

3. Using Wrong Format

Don’t compress a PNG screenshot as JPG — the artifacts on text are obvious. Use PNG or WebP lossless.

4. Ignoring Use Case

Email attachments: 200-500KB max
Web hero images: 100-300KB
Social media: Let the platform handle it
Print: Don’t compress (use lossless)

5. Forgetting About Dimensions

Resizing first often reduces file size more than aggressive compression, with better quality. A 4000×3000 image resized to 1920×1440 is 56% the original area = 56% the file size, even before compression.

Advanced: Target File Size Compression

Sometimes you have a specific size constraint (e.g., “must be under 100KB for email”). Most tools don’t do this directly, but you can:

Start with a reasonable quality (e.g., 85%)
Measure the result
If too large, reduce quality (e.g., 80%, 75%, …)
Repeat until target size is hit

AmberPic’s Image Compressor has a “target size” mode that automates this.

Advanced: Resize First, Then Compress

For best results, follow this order:

Resize to the target display dimensions (e.g., 1920px wide for hero)
Compress to 80-85% quality
Convert to WebP or AVIF for further size reduction

This approach preserves more quality than aggressive compression alone.

The Math of Compression

Quick file size estimation:

Final Size ≈ (Original Size) × (Quality Factor) × (Dimension Factor)

Where:
- Quality Factor = 0.5 for JPG q=85, 0.3 for q=75
- Dimension Factor = (new width / old width)² × (new height / old height)²

Example: 4000×3000 image, 4MB original, resized to 1920×1440, compressed to JPG q=85:

Dimension Factor = (1920/4000)² × (1440/3000)² = 0.23 × 0.23 = 0.053
Quality Factor = 0.5
Final Size ≈ 4MB × 0.5 × 0.053 ≈ 106KB

A 4MB original compresses to ~106KB with no visible quality loss. That’s a 97% reduction.

Tools for Compression

Browser-Based

AmberPic’s Image Compressor — free, no upload, supports batch processing, target size mode.

Desktop

ImageOptim (Mac): Drag-and-drop batch optimization
FileOptimizer: Windows, multi-format
XnConvert: Cross-platform, batch

Command Line

cwebp (Google): WebP encoder
avifenc (AOM): AVIF encoder
jpegoptim: JPG optimizer
optipng, pngquant: PNG optimizers
ImageMagick: Multi-purpose

Build Tools

imagemin (Node.js): Build-pipeline image optimization
Webpack/Vite plugins: Auto-optimize on build
Cloud services: Cloudinary, Imgix

Frequently Asked Questions

What’s the best JPG quality for web? 80-85%. This gives 50-60% size reduction with no visible quality loss.

Can I compress a JPG without losing quality? Lossy compression always loses some quality. But you can use lossless JPG optimization (strip metadata, optimize Huffman tables) to save 5-15% with no quality change.

Why is my PNG so big? PNG uses lossless compression. Photos don’t compress well in PNG. Convert to JPG or WebP for photos.

Should I compress images before or after resizing? After. Resizing reduces dimensions, which inherently reduces file size. Compressing after resize is more efficient.

Is WebP always better than JPG? For web use, yes — 30% smaller at equivalent quality. But for maximum compatibility (email, old software), JPG is still safer.

How does AVIF compare to WebP? AVIF is ~20% smaller than WebP at equivalent quality. But encoding is slower and support is slightly less universal.

Conclusion

Image compression is about finding the quality vs size balance for your use case. The defaults are good starting points: 80-85% JPG quality for photos, PNG lossless for graphics, and WebP for web images with JPG fallbacks.

AmberPic’s Image Compressor makes it easy to find the right balance: free, browser-based, supports both quality and target-size modes, and processes everything locally.

For more on web performance, see our guide to WebP vs JPG vs PNG vs AVIF.