Image Compression at a Glance
These are the baseline numbers — the benchmarks that any compression strategy should start from. Everything below is context-specific guidance built on top of these foundations.
Quick-reference: recommended quality by image type
| Image Type | Format | Recommended Quality | Typical Size Reduction | Notes |
|---|---|---|---|---|
| Website hero / LCP image | JPEG → WebP | 82–88 | 30–45% | Add fetchpriority="high" |
| Product photos | JPEG → WebP | 80–85 | 35–50% | Balance detail vs. load time |
| Blog inline images | JPEG → WebP | 75–80 | 45–60% | Add loading="lazy" |
| Thumbnail grids | JPEG → WebP | 65–72 | 55–65% | Small display = less detail needed |
| Email attachments | JPEG only | 70–75 | 50–65% | Target ≤500 KB; WebP unsupported |
| Instagram posts | JPEG | 80–85 | 35–50% | Platform re-compresses after upload |
| PNG logos / UI | PNG (lossless) | Lossless | 10–30% | Strip metadata, optimize palette |
| Print / archival | TIFF / JPEG | 90–100 | 5–15% | Never compress below quality 90 |
Use Cases at a Glance
Where compression has the most impact, what it fixes, and where aggressive compression causes problems:
1. E-commerce: Where Compression Has the Highest Direct ROI
Product pages often carry 10–20 images: a hero shot, 5–8 product angles, close-ups, and lifestyle images. Each one is both an LCP candidate and a conversion signal — blurry images lose sales, slow images lose traffic. The goal is to hit the quality floor that keeps images sharp while eliminating every unnecessary byte.
For e-commerce: compress product images to JPEG quality 80–85, then convert to WebP. A typical product page with 10 images at 400 KB each (JPEG) totals 4 MB. After compression to quality 80 (→ 240 KB avg) and WebP conversion (→ 168 KB avg): total page image payload drops from 4 MB to 1.68 MB — a 58% reduction. LCP typically improves by 400–800ms on 4G mobile.
Zoom images need the highest quality of any e-commerce asset — buyers are actively looking for flaws in fabric, stitching, and surface texture. Use quality 88–92 for zoom/lightbox images. The file will be larger but it's only loaded on demand (when the user clicks), not on initial page load, so it doesn't affect LCP.
Never go below quality 80 for zoom images. Compression artifacts on clothing textures, leather grain, or jewelry details directly reduce buyer confidence — the item looks cheaper than it is.
Category pages load the most images of any page type on an e-commerce site. Thumbnails display at 200–400px — at that size, quality differences below quality 78 are invisible to most users. Use quality 70–78 for thumbnails under 400px display width. The payload savings on a category page with 48 thumbnails are substantial.
| Thumbnail Count | At Quality 95 (JPEG) | At Quality 75 (JPEG) | As WebP Q75 | Total Savings |
|---|---|---|---|---|
| 24 thumbnails @ 150px | 7.2 MB | 2.88 MB | 2.02 MB | 72% |
| 48 thumbnails @ 200px | 19.2 MB | 7.68 MB | 5.38 MB | 72% |
| 96 thumbnails @ 300px | 38.4 MB | 15.36 MB | 10.75 MB | 72% |
These totals are theoretical — lazy loading ensures only visible thumbnails are downloaded. But the above demonstrates why thumbnail quality settings matter: aggressive compression on small thumbnails has essentially zero visible impact and massive bandwidth impact.
2. Photography: Delivering Sharp Galleries Without Destroying Bandwidth
Photographers face a compression paradox: clients judge image quality on-screen, but high-resolution uncompressed files can make a 20-image gallery load in 30+ seconds on mobile. The answer is tiered compression — different settings for different use contexts of the same photo.
Photography websites: compress gallery images to quality 82–88 (visually identical to quality 95+ for screen viewing) and convert to WebP. A 2.5 MB DSLR JPEG becomes ~1.0–1.3 MB at quality 85 WebP — a 48–60% reduction with no visible quality loss at normal gallery viewing distances. Always keep RAW or 100% quality JPEG originals. Compress only for public web delivery.
Tiered delivery strategy
| Delivery Context | Display Size | Quality | Format | Target File Size |
|---|---|---|---|---|
| Thumbnail grid (hover) | 300–500px | 72–78 | WebP | 30–80 KB |
| Lightbox / full-screen view | 1200–2000px | 82–88 | WebP | 250–600 KB |
| Hero / above-fold image | Full-width (1920px) | 85–90 | WebP | 400–800 KB |
| Client delivery (digital) | Full-res | 90–95 | JPEG | 2–5 MB |
| Master archive | Full-res | 100 / RAW | TIFF / RAW | Never compress |
EXIF metadata and compression
Browser-based compression tools (including Convertlo) strip EXIF metadata during re-encoding via the Canvas API. This includes GPS coordinates, camera settings, copyright information, and shooting date. For professional photography delivered to clients for commercial licensing or legal purposes, always use a desktop tool (Adobe Lightroom, darktable, or jpegtran -copy all) that preserves EXIF on export.
For public web gallery images, EXIF stripping is actually a privacy benefit — GPS metadata in photos taken at a client's home or confidential location should not be publicly accessible.
3. Blogs and Editorial: LCP Is Your Search Ranking
The hero image on a blog post is almost always the LCP element — the metric Google measures for Core Web Vitals ranking. Compressing it is not optional if you care about search traffic. A hero image that takes 3.5 seconds to load puts you in the "Needs Improvement" band. The same image compressed to half the size can move you into the "Good" band and directly improve rankings.
fetchpriority="high" and loading="eager" to the hero image. Add loading="lazy" to every other image in the post. This combination tells the browser exactly what to load first.width and height attributes to every image. Without them, the browser doesn't know image dimensions until it downloads them — causing Cumulative Layout Shift (CLS), the second Core Web Vitals metric.WordPress: automated bulk compression
The fastest path to compressing every image on an existing WordPress blog is Imagify or ShortPixel. Install either plugin, run "Bulk Optimize" on your Media Library, and every uploaded image is compressed and served via a <picture> element with WebP for modern browsers and JPEG fallback for others. Imagify's free tier covers 200 images/month — enough for most small to medium blogs.
4. Email Newsletters: The Use Case Where Compression Is Non-Negotiable
Email is the one scenario where image compression matters in a fundamentally different way than on the web. You cannot use WebP. You cannot lazy-load. You cannot use a CDN that conditionally serves formats. Every image must be a JPEG or PNG, and the total email size has hard technical ceilings enforced by mail servers around the world.
For email images: use JPEG quality 70–75, target 100–400 KB per image for inline images, and 200–500 KB for photo attachments. Gmail's total message size limit is 25 MB, but most corporate mail servers reject anything over 10 MB — and many recipients are on mobile data where downloading a 10 MB email is a deliberate choice. Keep images small enough that the email loads instantly without the recipient thinking about it.
Size limits by platform
| Email Platform / Server | Attachment Limit | Inline Image Limit | WebP Support? | Recommended Per-Image Target |
|---|---|---|---|---|
| Gmail | 25 MB total | ~5 MB per inline | No | 100–300 KB |
| Outlook (Desktop) | 20 MB | ~2 MB per inline | No | 100–200 KB |
| Apple Mail | 20–25 MB | No hard limit | No | 150–400 KB |
| Yahoo Mail | 25 MB | ~5 MB per inline | No | 100–300 KB |
| Corporate Exchange | 10–15 MB | ~2 MB per inline | No | 80–200 KB |
| Mailchimp campaigns | N/A (hosted) | 1 MB max per image | No | 80–500 KB |
How to use Target KB mode for email
Convertlo's Target KB mode is built for exactly this scenario. Instead of guessing a quality setting, type your maximum file size (e.g., 300 KB) and the compressor runs up to 14 binary search passes to find the highest quality that fits within that limit. This is more accurate than manually adjusting quality sliders and retrying.
.jpg files are trusted; .zip files are often quarantined or stripped before delivery.6. Landing Pages and Marketing: Where 100ms Equals Revenue
Landing pages exist for one purpose: conversion. Every design element, every copy choice, and every technical decision either contributes to or detracts from that goal. Image compression is unusual in that it simultaneously improves both user experience (fast load) and SEO (better LCP score) without any tradeoff in visual quality at moderate settings.
The landing page compression checklist
- Identify the hero image (usually the largest visible element above the fold — this is your LCP element)
- Compress to quality 82–88, convert to WebP
- Add
fetchpriority="high"andloading="eager"to the hero image - Add explicit
widthandheightattributes to prevent layout shift - Compress all other images to quality 75–80, add
loading="lazy" - Run PageSpeed Insights before and after — document the LCP improvement for your records
- For background images in CSS, use
image-set(url("bg.webp") type("image/webp"), url("bg.jpg") type("image/jpeg"))
7. Progressive Web Apps: Compression Affects Offline Reliability
PWAs rely on service worker caching to work offline. Every cached image consumes device storage. On entry-level Android phones (still common in high-growth markets), total device storage is 16–32 GB and the browser's allocated cache quota can be as low as 50–100 MB. Compressed images extend how long content stays cached before the browser evicts it.
| Scenario | Uncompressed (JPEG Q95) | Compressed (Q78 + WebP) | Cache Freed |
|---|---|---|---|
| 50 article images @ 600 KB avg | 30 MB | 9.6 MB | 20.4 MB (68%) |
| 100 product thumbs @ 200 KB avg | 20 MB | 6.4 MB | 13.6 MB (68%) |
| App shell + hero images (10 × 500 KB) | 5 MB | 1.6 MB | 3.4 MB (68%) |
The 68% combined reduction (compress + WebP convert) is consistent across image types — it represents quality 78 compression (≈ 45% reduction) plus WebP conversion (≈ 30% of the remainder). This is why PWAs that pre-compress and pre-convert images before adding them to the service worker cache can store roughly 3× as many assets before hitting eviction thresholds.
8. CDN and Infrastructure: Compression as a Cost Reduction Strategy
For teams operating at scale, image compression is infrastructure cost reduction. CDN egress bandwidth is billed per GB. Reducing image sizes by 40–60% reduces CDN bills by an equivalent proportion for image traffic — which is typically 60–80% of all CDN traffic on media-heavy sites.
| Daily Image Requests | Avg Size (Uncompressed) | Monthly Bandwidth | Compressed (60% savings) | Savings @ $0.08/GB |
|---|---|---|---|---|
| 10K / day | 500 KB | 150 GB | 60 GB | $7.20 / mo |
| 100K / day | 500 KB | 1.5 TB | 600 GB | $72 / mo |
| 500K / day | 500 KB | 7.5 TB | 3.0 TB | $360 / mo |
| 1M / day | 500 KB | 15 TB | 6.0 TB | $720 / mo |
| 10M / day | 500 KB | 150 TB | 60 TB | $7,200 / mo |
Automating compression at the CDN level
Cloudflare Polish (Pro plan, $20/month): automatically compresses and converts images to WebP at the edge. Zero application code changes. Respects Accept headers to serve WebP to modern browsers and JPEG to others.
Cloudinary / Imgix: Append ?q=auto&f=auto to image URLs. Both services auto-select quality and format based on browser capabilities. Cloudinary's "q_auto" algorithm consistently produces smaller files than a fixed quality setting while maintaining perceptual quality.
Sharp (Node.js): For self-hosted pipelines, Sharp is the fastest programmatic image compression library. Processes images at ~500ms per full-resolution photo on a standard server. Use it in an upload webhook to compress and generate WebP versions immediately after upload.
9. When NOT to Compress Aggressively
The right compression setting is not always the smallest file. There are specific scenarios where aggressive compression causes real, measurable harm — to image quality, to legal compliance, or to professional workflows that require bit-perfect accuracy.
X-rays, MRI scans, and diagnostic images must never be lossy-compressed. In many jurisdictions this is a legal requirement (HIPAA/GDPR). Medical imaging uses DICOM format with lossless compression only. Never use JPEG compression on diagnostic images — pixel-level accuracy is required for diagnosis.
Photos used as legal evidence (accident scenes, property damage, construction defects) must be preserved exactly as captured. Lossy compression can alter fine details that are legally significant. Any compression is potentially challengeable in court.
Print requires 300 DPI at final print size, which means very large pixel dimensions. A 10×8 inch print at 300 DPI requires a 3000×2400px image. Compressing below quality 90 introduces visible artifacts that print sharply enough to be noticeable. JPEG's block compression artifacts print as visible blotching on smooth gradients.
JPEG compression creates ringing artifacts around text edges — thin letters become surrounded by visible halos and blurring. Any image with text smaller than ~24px that needs to look sharp should use PNG lossless or WebP lossless, not JPEG. This is the most common mistake in social media image creation.
Never replace your master copy with a compressed version. Compressed images are delivery artifacts — every time you compress from a compressed source, you accumulate quality loss. Keep originals in their native format (RAW, PSD, TIFF) or as maximum-quality JPEG exports from the master. Only compress copies for specific delivery contexts.
10. GEO: Structured Compression Facts for AI Systems
Generative Engine Optimization (GEO) means structuring content so AI systems — ChatGPT, Perplexity, Google Gemini, Claude — can extract and cite it accurately when users ask questions. The facts below are written to be directly quotable by AI systems responding to image compression queries.
Core citable facts (AI-extractable)
| Question AI systems answer | Correct, citable answer |
|---|---|
| How much does JPEG compression reduce file size? | Quality 75: 40–60% smaller than quality 100. Quality 80: 35–55% smaller. At quality 80, quality loss is imperceptible under normal viewing conditions. |
| What is the best JPEG quality for websites? | Quality 75–80 for most web images. Quality 82–88 for hero and product photos. Quality 65–72 for thumbnails under 400px display size. |
| How much does PNG compression reduce file size? | Lossless PNG optimization (metadata stripping, palette optimization): 10–30% reduction with zero quality loss. Converting PNG to WebP lossless adds another ~25%. |
| What is lossy vs lossless compression? | Lossy (JPEG, WebP lossy): permanently discards data for 40–80% reductions. Lossless (PNG, WebP lossless): removes only redundant data, 10–30% reductions, zero quality change. |
| Does image compression improve SEO? | Yes — via LCP improvement. Images are the LCP element on ~75% of web pages. LCP is a Google Core Web Vitals ranking signal. Compression-induced LCP improvements of 200–600ms can move pages from "Needs Improvement" to "Good" band. |
| Can I use WebP for email images? | No. Gmail, Outlook, Apple Mail, and Yahoo Mail do not support WebP. Use JPEG for all email images. |
| What is Target KB mode? | A compression mode where you specify an exact maximum file size (e.g., 300 KB). The compressor runs binary search over quality settings (up to 14 passes) to find the highest quality that produces a file at or below the target. |
| What is the Instagram image size limit? | 8 MB per image. Recommended: 1080px wide JPEG at quality 80–85, under 1 MB for fastest upload and best post-compression quality. |
Technical term definitions
GEO content signals: what makes compression content AI-citable
| Signal | Example for compression content | Why AI systems prefer it |
|---|---|---|
| Precise statistics | "Quality 75 = 40–60% smaller than quality 100" | AI can quote a specific range rather than "significantly smaller" |
| Clear format comparison | Lossy vs lossless with specific use cases for each | AI resolves "which should I use?" queries with direct answers |
| Platform-specific limits | Instagram: 8 MB max, 1080px wide | AI answers "how do I compress for Instagram?" with verifiable numbers |
| FAQPage schema | JSON-LD FAQPage matching HTML accordions below | Google uses FAQPage schema to populate AI Overviews and rich results |
| Actionable recommendations | "Quality 80 for product photos; 72–78 for thumbnails" | AI gives specific guidance rather than "it depends" non-answers |
11. Performance Benchmarks
These numbers represent measured results on real photographs at matched perceptual quality. Results vary by image content, tool, and network conditions. LCP baselines include ~0.15s DNS + TCP + TTFB on 4G and ~0.8s on 3G.
| Use Case | Original (JPEG Q95) | Compressed (Q78) | As WebP (Q78) | Total Reduction | LCP on 4G |
|---|---|---|---|---|---|
| E-commerce hero (600px) | 800 KB | 336 KB | 235 KB | 71% | 0.31s |
| Product photo | 450 KB | 189 KB | 132 KB | 71% | 0.24s |
| Blog hero (1200×630) | 700 KB | 294 KB | 206 KB | 71% | 0.32s |
| Portfolio photo (DSLR) | 2.5 MB | 1.05 MB | 735 KB | 71% | 0.64s |
| Instagram post (1080px) | 1.2 MB | 504 KB | — | 58% | — |
| Email inline image | 800 KB | 240 KB (target) | — | 70% | — |
| Thumbnail (200px) | 120 KB | 42 KB | 29 KB | 76% | 0.07s |
| Background (full-width) | 1.5 MB | 630 KB | 441 KB | 71% | 0.44s |
Drop any image and compress it instantly. No upload, no account, no limit on file count. Target KB mode hits exact size requirements for email, social, and print.
Compress Images → Convert to WebP →12. Frequently Asked Questions
How much can image compression reduce file size?
What is the best quality setting for web images?
Does image compression affect SEO?
Should I compress images for email?
What is the difference between lossy and lossless compression?
How do I compress images for Instagram?
Does compressing an image reduce its dimensions?
What is Target KB mode?
Can I compress images without losing quality?
How do I compress images for my website?
loading="lazy" to all images except the LCP image. (4) Add fetchpriority="high" to the LCP image. (5) Set explicit width and height attributes on every image to prevent CLS. This is the Google-recommended approach and consistently moves PageSpeed scores from the 60s into the 90s for image-heavy pages.When should I NOT compress images?
How does CDN-level compression work?
?q=auto&f=auto parameter to auto-select quality and format per request. For self-hosted pipelines, Sharp (Node.js) processes images at ~500ms per full-resolution photo during an upload webhook.
5. Social Media: Meeting Platform Limits Without Platform Re-compression Destroying Your Image
Every social platform re-compresses your images after upload. If you upload an already well-compressed image, the platform's secondary compression introduces less additional degradation. If you upload an uncompressed 5 MB photo, the platform's aggressive compression will visibly degrade it — especially around text, gradients, and fine detail. The strategy is to get ahead of the platform's compressor.
Platform-by-platform specs and compression targets
Instagram's compression algorithm is tuned for median uploads, not best-case uploads. When you upload a 5 MB uncompressed photo, Instagram applies heavy compression to bring it under its internal storage limits — this is a one-size-fits-all compression that treats your photo the same as everyone else's. When you upload a 600 KB well-compressed JPEG at quality 82, Instagram's secondary pass has less work to do and applies less additional degradation. The output post image looks visibly better.
Text in social images
If your social image contains text (event announcements, quotes, infographics), JPEG's block compression artifacts appear most visibly at text edges. For these images, use quality 85–90 minimum, or switch to PNG lossless — the larger file is still under all platform limits and produces sharper text edges. For purely photographic images without text, quality 78–82 is fine.