A photo from a modern phone is 4–8 MB. A website that loads six of them is already over 30 MB before the HTML, CSS, and JavaScript even load. That's why image compression is one of the highest-leverage things you can do for page speed — and for storage, email attachments, and anything else where file size matters.
The good news: done right, compression is invisible. The image looks identical; the file is 70–90% smaller.
Lossy vs. Lossless Compression
Lossless compression removes redundant data without touching image quality. A PNG compressed losslessly is pixel-identical to the original — the algorithm just stores repeated patterns more efficiently. The downside is smaller savings: typically 10–30%.
Lossy compression permanently discards image data that the human eye is unlikely to notice — subtle color gradations in smooth areas, high-frequency detail in backgrounds. Done at the right quality setting, the result is visually identical to the original. Done too aggressively, you get visible blocking or smearing artifacts. Savings of 70–90% are common.
For photos: use lossy compression. For logos, diagrams, and screenshots with text: use lossless or be conservative with lossy settings.
Which Format to Use
JPEG is lossy-only and best for photographs. It handles gradients and complex color well but struggles with sharp edges and text — you'll see artifacts around high-contrast boundaries.
PNG supports lossless compression and is best for graphics, logos, screenshots, and anything with transparency. PNG files of photographs are large; use JPEG for photos instead.
WebP is a modern format that supports both lossy and lossless modes and generally achieves smaller files than JPEG or PNG at equivalent quality. Browser support is now universal. If you're optimizing for the web, WebP is usually the right output.
A quick decision rule:
- Photo for a website → WebP (lossy) or JPEG
- Logo or icon → WebP (lossless) or PNG
- Screenshot with text → PNG or WebP (lossless)
- Need transparency → WebP or PNG
How to Compress an Image
The Image Compressor on this site runs entirely in your browser — no upload, no server, no file size restrictions.
- Drop in your JPEG, PNG, or WebP file
- Adjust the quality slider (80 is a good starting point for photos)
- Compare the before/after preview and file size
- Download when satisfied
The side-by-side preview lets you see exactly where quality degrades before you commit. Most photos look identical to the original at quality 75–85 while being 60–80% smaller.
The Quality Setting Sweet Spot
Quality 85 (out of 100) is a widely used default for web images. At that setting, most people cannot tell the compressed image from the original, even side by side. Quality 60–70 cuts file size further with tradeoffs that are visible only on close inspection of smooth color areas like skies or skin tones.
Quality 40 and below starts looking bad for photographs. Fine for thumbnails, not for featured images.
What Not to Compress
Images with text are the main exception. JPEG compression creates visible artifacts around letter edges. Use PNG or lossless WebP for screenshots, infographics, or anything with readable text overlaid.
Already-compressed images don't compress well again. Re-compressing a JPEG at the same quality setting produces a worse result than the original at that quality — artifacts from the first pass are encoded alongside the actual image data. Start from the highest-resolution original available.
Target File Sizes for Different Contexts
"Compress this image" means different things depending on where the image is going. These are the practical targets worth knowing:
Website hero images — Under 200 KB is the standard target for images that load above the fold. A 1920×1080 WebP at quality 80 typically lands around 100–150 KB. Over 300 KB on a hero image will noticeably affect page load scores.
Website thumbnails and cards — Under 50 KB. A 400×300 WebP at quality 75 is typically 20–40 KB. These load in quantity on listing pages, so their cumulative weight adds up fast.
Email attachments — Under 1 MB per image for most email clients. Some corporate mail servers reject attachments over 10 MB total, so multiple photos in one email should each be compressed. JPEG at quality 80 is the safest format for email — WebP may not render in older Outlook versions.
Messaging apps (WhatsApp, iMessage, Telegram) — These apps re-compress images on upload anyway, so sending at moderate quality (70–80) is fine. Sending at very low quality (under 60) risks double-compression artifacts.
Social media — Platforms re-compress everything. Upload the original or a lightly compressed version (quality 90+) and let the platform handle it. Compressing heavily before upload and then having the platform compress again stacks quality loss.
Print — Compression is almost never appropriate for print. Print requires high resolution and maximum quality. Compress only if you are creating a digital proof or preview, not the print-ready file.
Compressing Screenshots and UI Images
Screenshots of text, interfaces, and diagrams need different handling than photographs.
The problem with JPEG compression on screenshots is that it introduces artifacts around high-contrast edges — the boundary between a black letter and a white background is exactly the kind of sharp edge that JPEG handles poorly. At quality 80, text in a screenshot can look noticeably blurry or ringed with color fringing.
The right approach for screenshots with readable text:
- Use PNG — lossless and produces clean, artifact-free output
- Or use WebP in lossless mode — same quality as PNG but 20–30% smaller
- Only use JPEG for screenshots where text is small or where file size is the absolute priority and some quality loss is acceptable
For screenshots that are purely photographic — a screen recording of a video, a product photo on a website, a map screenshot — JPEG and lossy WebP are fine because the content has the same characteristics as a photograph.
If You Need to Resize, Not Just Compress
Compression reduces file size while keeping the pixel dimensions. If you need to resize (change the actual pixel width and height), the Image Converter handles format conversion with resizing, or the Image Upscaler can increase resolution using Lanczos resampling when you need a larger version of a small image.
Frequently Asked Questions
Does the Image Compressor upload my files to a server?
No. Everything runs in your browser using the Canvas API. Your images are compressed locally and never transmitted anywhere. There is no account required and no file size limit imposed by a server.
What quality setting should I use?
80–85 is the right starting point for most photos. At that setting, the compressed image is visually indistinguishable from the original at normal viewing sizes while being 60–80% smaller. Use the side-by-side preview to find the lowest quality setting where you cannot see a difference.
Which format produces the smallest file size?
WebP consistently produces smaller files than JPEG or PNG at equivalent quality — often 25–35% smaller than JPEG. If you are optimizing images for a website, WebP is the right output format. For photos going to email or platforms that may not support WebP, JPEG is the safe choice.
Can I compress a PNG with the Image Compressor?
Yes. PNG compression in this tool applies lossy recompression, which can reduce PNG file sizes significantly beyond what standard lossless PNG compression achieves. The tradeoff is that the output is no longer pixel-perfect. For logos and screenshots with text that need pixel-perfect quality, lossless output is the better choice.
Why does re-compressing an already-compressed JPEG make it worse?
JPEG compression introduces artifacts into the image data. When you re-compress, those artifacts are encoded again alongside the underlying image. The result is worse than the original at the same quality setting. Always start from the highest-resolution original you have.
Quick Checklist
- [ ] Chose the right format for the content type (JPEG/WebP for photos, PNG for graphics with text)
- [ ] Started with the highest-resolution original, not an already-compressed copy
- [ ] Set quality to 80–85 as a starting point, then adjusted based on the preview
- [ ] Verified text and sharp edges look clean before downloading
- [ ] Used WebP output for anything going on a website