You export a photo from Lightroom, Photoshop, or your phone and it's 8 MB. You need it under 200 KB for your website, email campaign, or CMS upload limit. You drag the quality slider down — but how far is too far? At what point does the image start looking bad? And why does re-saving a JPEG make it worse each time?
JPEG compression is the most widely used image format on the web, yet most people use it on autopilot. Understanding how it actually works — and which settings to use for which situations — is the difference between images that look sharp at 150 KB and images that look terrible at 400 KB.
JPEG compression works by breaking an image into 8×8 pixel blocks, converting them into frequency data using the Discrete Cosine Transform (DCT), and discarding high-frequency details the human eye is least sensitive to. For web use, a quality setting of 75–85 delivers files 70–90% smaller than the original with no visible degradation. Never re-save a JPEG from a JPEG — always keep the original.
What is JPEG compression?
JPEG (Joint Photographic Experts Group) is a lossy compression format — meaning it permanently discards some image data every time you save. Unlike PNG, which encodes every pixel exactly, JPEG makes calculated bets about which visual information the human eye won't miss, then throws that information away to shrink the file.
The process happens in three stages under the hood:
- Color space conversion. The image is converted from RGB to YCbCr — a format that separates brightness (Y) from color information (Cb and Cr). Human eyes are far more sensitive to brightness than to color, so the color channels are immediately downsampled by a factor of 2, cutting color data in half with almost no visible effect.
- Discrete Cosine Transform (DCT). The image is divided into 8×8 pixel blocks. Each block is transformed from raw pixel values into a set of frequency coefficients — essentially describing the block as a mix of wave patterns from coarse (low frequency) to fine (high frequency). The DCT itself is lossless; it's just a change of mathematical representation.
- Quantization. This is where actual data is lost. The frequency coefficients are divided by a quantization table — higher quality settings use smaller divisors, preserving more coefficients. Lower quality settings use larger divisors, rounding many high-frequency coefficients to zero and discarding fine detail. The quantization step is the core of JPEG compression and is entirely controlled by your quality setting.
After quantization, the remaining coefficient data is losslessly encoded using Huffman coding — a final compression pass that reduces redundancy without losing any more data. The quality setting you choose controls exclusively how aggressively the quantization step discards information; it has no effect on the DCT or Huffman stages.
Why it matters for your site and workflow
JPEG is the dominant format for photographs on the web. Getting the compression right has downstream effects that ripple through every digital touchpoint:
- Core Web Vitals and SEO. Google's LCP (Largest Contentful Paint) metric is heavily influenced by image payload. An uncompressed 6 MB hero photo on mobile can single-handedly push your LCP past the 4-second threshold — costing ranking points and user retention simultaneously.
- Bandwidth and CDN costs. If you're serving images from AWS S3, Cloudflare, or similar, every additional KB of image payload is an additional cost multiplied across every page view. Properly compressed JPEGs at scale translate directly to a smaller infrastructure bill.
- User experience on mobile networks. Despite widespread 5G adoption, a significant portion of web traffic still occurs on 3G/4G connections — especially in emerging markets. An 800 KB JPEG loads in under a second on fiber; it takes 4–6 seconds on a congested 3G connection.
- Email rendering. Email clients like Gmail and Outlook defer or block large inline images. A compressed product photo at 90 KB renders immediately; the same image at 2 MB may be clipped or blocked entirely, especially on mobile Gmail.
- Platform upload limits. Social networks, CMS platforms, and e-commerce systems all impose file size caps. Getting your JPEG settings right means fewer re-exports and resizes later in your workflow.
Step-by-step: how to compress a JPEG correctly
- Start from the original, never from a JPEG. Before you compress anything, make sure you're working from a lossless source — a RAW file, a TIFF, a PSD, or a PNG. Every re-save from an existing JPEG compounds artifacts. If your only source is a JPEG, accept that this is your quality ceiling and work down from there.
- Identify your target output context. Are you compressing for a web page, an email, a print file, or a social media upload? Each context has a different acceptable file size and viewing distance. Web thumbnails can tolerate more compression than hero images; print files need near-lossless settings. Match your quality setting to the context, not to a single universal number.
- Choose your quality setting range. As a starting point: 75–82 for web thumbnails and secondary images, 82–88 for web hero images and product photos, 90–95 for client deliverables and print-adjacent uses. Never go below 70 for anything user-facing unless file size is the absolute constraint.
- Strip EXIF metadata. Camera JPEGs embed GPS coordinates, camera model, lens data, copyright, and color profiles — often adding 30–150 KB of invisible overhead. Tools like ExifTool, ImageOptim, or the Rebrixe JPEG Compressor strip this automatically. Always remove metadata before publishing; it also protects user privacy if you're working with user-uploaded content.
- Consider chroma subsampling settings. Most JPEG exporters default to 4:2:0 chroma subsampling, which halves color resolution in both axes. For photographs this is usually invisible. For images with sharp color boundaries — infographics, text on colored backgrounds, screenshots — switch to 4:4:4 (no subsampling) to avoid color fringing on edges.
-
Use progressive encoding for web images. A progressive JPEG loads in multiple passes — it appears blurry, then sharpens — rather than loading top-to-bottom like a baseline JPEG. This makes pages feel faster on slow connections. In Photoshop, this is the "Save for Web → Progressive" option; in ImageMagick it's
-interlace plane. - Do a visual check at 100% zoom. Open the exported JPEG side-by-side with the original. Look for blocking artifacts (visible squares in smooth areas), ringing (dark halos around sharp edges), and color banding in gradients. If you see any of these, increase quality by 5 points and re-export. If the images look identical, try decreasing by 5 to see if you can go smaller without visible change.
- Consider WebP as an alternative. If you're compressing for modern web delivery, WebP produces files 25–35% smaller than JPEG at equivalent visual quality. All major browsers support it as of 2024. The Rebrixe JPEG to WebP Converter handles the conversion client-side with no uploads required.
Common mistakes that ruin JPEG quality
1. Re-saving a JPEG from a JPEG
This is the single most destructive workflow error in image handling. Every time you open a JPEG, make any edit — even just cropping — and save it again as JPEG, you're running the quantization step on already-quantized data. Artifacts from the first save get re-quantized in the second save, compounding into visible blocking and smearing. After 3–5 generations of re-saving, even a high-quality original becomes noticeably degraded. The fix: always keep the original in a lossless format and only export to JPEG as the final step, never as an intermediate.
2. Using quality settings below 70 for photographs
The file size savings below quality 70 are real, but so are the visible artifacts. Compression blocking becomes apparent in smooth areas like sky gradients, skin tones, and out-of-focus backgrounds. If your file size target requires going below 70, you're better served by resizing the image dimensions down first — a photograph at half resolution saved at quality 82 will almost always look better and be smaller than the full-resolution image saved at quality 55.
3. Ignoring chroma subsampling for text-heavy images
JPEG's default 4:2:0 chroma subsampling is tuned for photographs where color boundaries are soft. Apply it to an image with sharp color transitions — text on a solid background, a bar chart, a logo embedded in a photo — and you get color fringing: red or blue halos on black text, muddy edges on flat-color graphics. Switch to 4:4:4 subsampling (no color downsampling) for any JPEG that contains text or flat design elements.
4. Not stripping metadata before publishing
Camera-generated JPEGs can carry 50–200 KB of EXIF metadata — GPS location, device serial numbers, shooting parameters. This data is invisible to viewers but adds measurable weight to every file served. More importantly, if you're publishing images taken on a personal device, that GPS data reveals exactly where the photo was taken. Always strip metadata before serving images publicly.
5. Using JPEG for images that require transparency
JPEG has no alpha channel. If your image needs a transparent background — a product cut-out, a logo, an icon — JPEG will fill the transparency with a flat color (usually white or black, depending on the tool). Use PNG or WebP for any image requiring a transparent background. Using JPEG for transparency-dependent assets is a mistake no re-compression can fix.
Real-world compression examples
These results are from exporting common photograph types at quality 82 with metadata stripped and progressive encoding enabled, using the Rebrixe JPEG Compressor:
The pattern: photographs compress dramatically with no visible loss at quality 82. Graphics with sharp color boundaries and text compress less and require different subsampling settings — and for those, PNG or WebP is almost always a better format choice.
JPEG quality setting comparison
Not all quality settings are created equal. Here's how different ranges perform across file size, artifact risk, and appropriate use cases:
| Quality Range | Typical Size Reduction | Artifact Risk | Transparency | Best Use Case |
|---|---|---|---|---|
| 95–100 | 20–35% | None | No | Print, archival, editing masters |
| 88–94 | 40–60% | Minimal | No | Client deliverables, high-quality web heroes |
| 75–87 | 65–85% | Imperceptible | No | Web photographs, product photos, email images |
| 60–74 | 80–90% | Visible at 200%+ | No | Thumbnails, low-bandwidth contexts only |
| Below 60 | 90%+ | Clearly visible | No | Avoid for any user-facing content |
Compress your JPEG right now — free
The Rebrixe JPEG Compressor runs entirely in your browser. Your images are never uploaded to a server — compression happens locally with full control over quality settings, metadata stripping, and progressive encoding. No account, no file size limits, no watermarks.