Blog Utilities 7 min read

How to Compress Images Without Losing Quality

A 5 MB product photo and a 400 KB version of the same photo look identical on screen. The difference is 4.6 MB of data your visitors don't need to download. Here's how compression works and where the safe limits are.

How to compress images without losing quality

File Size Is a Performance Tax

Every uncompressed image on a webpage is bandwidth your visitor pays for — in load time, in mobile data, in patience. A product page with ten 4 MB photos takes 40 MB to load. On a fast connection that's a few seconds of waiting. On a 3G connection in a rural area, it's a minute. Google measures this: Core Web Vitals penalize pages where the Largest Contentful Paint takes too long, and oversized images are the most common reason it does.

Try it free: Image Compressor — Compress images without visible quality loss. Runs in your browser, no signup needed.

Compression solves this without requiring you to make the image smaller in pixel dimensions. A 3000×2000 photo can stay 3000×2000 — same resolution, same detail — while the file shrinks from 5 MB to 500 KB. The trick is discarding data the human eye doesn't notice.

How Lossy Compression Works

JPEG and WebP are lossy formats. They analyze the image, identify information that contributes least to perceived quality, and throw it away. The process is one-directional — once data is discarded, it cannot be recovered.

JPEG compression operates on 8×8 pixel blocks. Each block is transformed from spatial pixel data into frequency coefficients using a Discrete Cosine Transform (DCT). High-frequency coefficients — the ones representing fine texture, subtle noise, and barely-visible edge detail — are quantized more aggressively at lower quality settings. At quality 90%, the encoder keeps most of the frequency data. At quality 30%, it keeps only the dominant shapes and colors, producing visible blockiness and color banding.

WebP uses a similar principle but with more advanced prediction and entropy coding, which is why it typically achieves 25–35% smaller files than JPEG at the same visual quality. For a detailed look at how JPEG compression creates artifacts, see our guide on JPEG compression artifacts.

💡 Quality isn't linear

Going from 95% to 85% might cut file size in half with no visible difference. Going from 85% to 75% saves another 30% but starts showing artifacts on sharp edges. Going from 75% to 50% saves less and looks noticeably worse. The returns diminish fast below 80%.

Using the Image Compressor

Open the Image Compressor and upload any image — JPEG, PNG, WebP, GIF, BMP, TIFF, or even HEIC. The tool gives you two modes.

Quality mode is the default. Drag the slider to set a quality percentage (1–100%). The tool re-encodes your image at that level and shows a before/after size comparison: "4.2 MB → 380 KB (91% reduction)." You see the compressed preview immediately and can adjust the slider until the result looks right.

Target size mode flips the problem. Instead of choosing quality and seeing what size you get, you enter a maximum file size in KB and the tool finds the highest quality that fits. It runs a binary search — testing quality 50%, then 75% or 25%, narrowing down over up to 12 iterations in under a second. This is the mode to use when a form says "max 200KB" or an email bounces because attachments are too large.

Output format defaults to JPEG but you can switch to WebP (smaller files) or PNG (lossless). After compression, download the result or reset to try different settings on the same image.

Want to try it? Compress any image with adjustable quality or target size — free, no upload.

Compress an Image →

Finding the Right Quality Setting

The right number depends on what the image is for and what it contains. Photographs with smooth gradients (sky, skin, water) tolerate heavy compression well — the DCT is efficient at encoding gentle transitions. Images with sharp text, fine lines, or high-contrast edges (screenshots, diagrams, product labels) show artifacts sooner.

88–95% — Portfolio, hero images, print preparation. Virtually indistinguishable from the original. Use this when quality is the priority and file size is secondary. Pair with the Print Readiness Scanner to verify DPI before printing.

75–87% — General web use, product photos, blog images. The sweet spot for most purposes. File sizes drop dramatically with minimal visual impact. This is where most professional image optimization tools land.

60–74% — Thumbnails, email previews, low-priority images. Visible quality loss on close inspection, but acceptable at small display sizes or quick-glance contexts.

Below 60% — Only for extreme constraints. Noticeable blockiness, color banding, and loss of fine detail. Text becomes hard to read. Use only when a strict file size limit leaves no alternative.

Target Size Mode — When You Need Exactly 100KB

Upload forms, email systems, and social platforms often enforce file size limits. A passport photo upload might cap at 200 KB. An HR system might reject anything over 500 KB. Rather than guessing quality percentages, enter the target and let the binary search find the answer.

The algorithm works only with lossy formats (JPEG and WebP) because lossless PNG has no quality dial to adjust. If your target is very aggressive — say, 50 KB for a 4000×3000 photo — the result will look rough. In that case, resize the image to smaller dimensions first, then compress. Reducing a 4000×3000 photo to 1200×900 before compression gives a much better-looking 50 KB file than compressing the full-resolution version.

🔍 Common targets

Passport/visa photo: 100–200 KB. Email attachment: 500 KB–1 MB. Web page image: 100–300 KB. Social media post: 500 KB–2 MB (platforms compress further on upload anyway). Several preset target pages are available for common sizes.

JPEG vs WebP vs PNG — Compression Trade-offs

Each format compresses differently, and the choice matters more than most people think.

JPEG compresses photographs efficiently and is universally supported. Every browser, email client, and image viewer on every platform reads JPEG. For general-purpose compression of photos, it's the default for a reason. Downside: no transparency, and re-saving a JPEG at a new quality level introduces additional generation loss — each re-encode degrades slightly. For forensic analysis of double-compressed JPEGs, see the JPEG Ghost Scanner.

WebP achieves 25–35% smaller files than JPEG at equivalent visual quality. It supports both lossy and lossless modes, plus transparency. All modern browsers handle it. The only gaps are older desktop software and some email clients. If your output is destined for the web, WebP is almost always the better choice. To convert other formats to or from WebP, use the Format Converter.

PNG uses lossless DEFLATE compression. Every pixel is preserved exactly. But "lossless" doesn't mean "small" — a PNG photograph is typically 3–5× larger than an equivalent-quality JPEG. PNG excels at images with large flat-color regions: screenshots, UI mockups, diagrams, logos. For photos, it's an archival choice, not a compression choice.

What Compression Strips Besides Pixels

Browser-based compression re-renders the image through the HTML5 Canvas API. This process strips all embedded metadata — EXIF camera settings, GPS coordinates, timestamps, copyright fields, color profiles. The output is pixel data only.

For most web use, this is fine or even desirable (one fewer privacy leak). But if you're compressing photos for a portfolio and need to preserve camera information, or if you need GPS data to stay intact for geolocation workflows, use a desktop tool that supports metadata-preserving export. To check what metadata exists before compressing, run the image through the EXIF Checker. To intentionally strip metadata for privacy, the EXIF Remover is purpose-built for that.

Compression for Specific Workflows

E-commerce product images. Most platforms recommend JPEG at 80–85% quality for product listing photos. Amazon suggests images under 1 MB. Compress after final editing and resizing — don't compress before editing, because editing a compressed image and re-compressing it doubles the generation loss.

Blog and content images. The hero image should look sharp (85–90% JPEG), but in-article illustrations can go lower (75–80%). If your article uses many images, total page weight matters more than individual image quality. Check your page's overall image weight with the Quality Analyzer.

Email attachments. Most email services cap attachments at 25 MB total. A batch of 15 vacation photos at 4 MB each won't attach. Compress to 500 KB–1 MB each, or use target size mode to enforce a ceiling.

Form uploads. Government forms, job applications, and university portals often demand specific limits — "photo must be under 200 KB" or "documents under 500 KB." Target size mode handles this directly.

Common Questions

What quality percentage should I use for web images? For photographs, 75–85% in JPEG or WebP gives the best balance of file size and visual clarity. Most viewers cannot distinguish 85% from 100% on a normal monitor. For hero images and portfolio work, stay at 88–92%. For thumbnails and email attachments, 70–80% works well.

How do I compress an image to a specific file size like 100KB? Use target size mode. Enter 100 in the KB field, and the compressor automatically finds the highest quality that fits. It works with JPEG and WebP — PNG can't target a specific size because it's lossless. If the target is very small for a large image, resize the dimensions first for better results.

Is PNG compression really lossless? Yes. PNG uses DEFLATE compression, which reduces file size without discarding any pixel data. Every pixel in the output is identical to the input. The trade-off is larger files — often 3–5× larger than JPEG for photographs. PNG works best for screenshots, diagrams, and images with large solid-color areas.

The 80% Rule

If you remember one number from this article, make it 80. JPEG quality 80% reduces file size by 60–80% from the uncompressed original with quality loss that's invisible at normal viewing distance on a normal screen. It's not the optimal number for every situation — portfolios deserve higher, thumbnails can go lower — but as a starting point when you just need a smaller file and don't want to overthink it, 80% is reliably good enough. The compressor shows you exactly what you're getting before you commit.

Compress an Image
Share:
S

Scanly.co — 92 free image analysis tools

Photo forensics, metadata, privacy, OCR, and utilities. All client-side.

Advertisement