Morph Blog
Image

Smaller files, same picture, explained.

Lossy vs lossless. JPEG quality sliders. WebP advantages. Optimal settings for web, email, social, and print — without the artifacts.

BY MORPH6 MIN READUPDATED APRIL 2026

You have a 5 MB photo and you need it under 1 MB for an email attachment, a website upload, or a form submission. You don't want it to look blurry. This guide explains how image compression actually works and how to shrink files dramatically while keeping them sharp.

Lossy vs lossless: the two types of compression

Every image compression method falls into one of two categories:

Lossy compression permanently removes data from the image. The algorithm decides which visual information is least noticeable to the human eye and discards it. JPEG is the most common lossy format. At high quality settings (80-95%), the removed data is invisible in normal viewing. Below 60%, artifacts become noticeable — blocky areas, color banding, smeared edges.

Lossless compression reduces file size without removing any data. The original image can be perfectly reconstructed. PNG uses lossless compression. So does WebP in its lossless mode. The tradeoff: lossless files are larger than lossy files. A lossless PNG of a photograph can be 5-10x larger than a JPEG of the same image at 85% quality.

Rule of thumb: use lossy (JPEG or WebP lossy) for photographs. Use lossless (PNG or WebP lossless) for screenshots, logos, diagrams, and anything with text or sharp edges.

The JPEG quality slider explained

When you export a JPEG, you choose a quality value from 0 to 100. This controls how aggressively the lossy algorithm compresses the image. Here's what the numbers actually mean:

QualityFile SizeVisual Result
100%LargestVirtually lossless. No visible difference from the original.
85-92%60-75% smallerIndistinguishable at normal viewing distance. Sweet spot for most uses.
70-84%75-85% smallerMinor artifacts visible if you zoom in. Fine for thumbnails and social.
50-69%85-92% smallerNoticeable softening. Acceptable for email where size matters.
Below 50%SmallestVisible blocky artifacts. Only when file size is critical.

The relationship between quality and file size isn't linear. Dropping from 100% to 85% often cuts file size by 60-70% with zero visible difference. Dropping from 85% to 50% only saves another 15-20% but introduces noticeable degradation. The high end of the quality range is where the biggest wins are.

WebP: the modern alternative

WebP is a format developed by Google that supports both lossy and lossless compression. In lossy mode, a WebP file is typically 25-35% smaller than a JPEG at the same visual quality. In lossless mode, it's about 26% smaller than PNG.

WebP also supports transparency (like PNG) and animation (like GIF), making it a versatile single format. As of 2026, every current browser supports WebP: Chrome, Firefox, Safari, Edge, and all mobile browsers.

The downside: some older applications and systems don't recognize WebP. If you need maximum compatibility — for email, for printing, for uploading to a form — JPEG is still the safest choice. For websites, WebP is strictly better.

Optimal settings by use case

For websites and blogs

Use WebP at 80-85% quality. Target 100-200 KB per image. Resize to the actual display dimensions — don't serve a 4000px image in a 800px container. This is the single biggest compression win: reducing pixel dimensions. A 4000x3000 photo resized to 1200x900 drops from 5 MB to under 300 KB before any quality adjustment.

For email attachments

Use JPEG at 80% quality. Most email services cap attachments at 25 MB, and recipients don't enjoy downloading large files on mobile. For a typical set of vacation photos, 80% JPEG keeps each image under 500 KB while looking great on screens.

For social media

Platforms like Instagram, Twitter, and Facebook recompress your images anyway. Upload the highest quality you can (JPEG 92% or PNG) and let the platform handle optimization. If you compress first and then the platform compresses again, quality degrades twice — generation loss.

For print

Don't compress. Print requires high resolution (300 DPI) and minimal compression artifacts. Use the original file or a JPEG at 95-100%. File size doesn't matter for print.

Resize to display dimensions first, then compress. That single step often saves 80% of the file size before you touch a quality slider.

How to compress images with Morph

Morph's image compressor runs entirely in your browser. Drop an image, adjust the quality slider, and see the estimated file size change in real time. When you're happy with the balance, download the compressed version.

You can also convert between formats: drop a 5 MB PNG and convert it to an 800 KB WebP, or a 3 MB HEIC and export it as a 400 KB JPEG. Every conversion and compression happens locally — your images stay on your device.

Morph never uploads your images. Compression runs on your CPU using the browser's native Canvas API and WebAssembly libraries. No server, no temporary storage, no data retention.

Common mistakes

Compressing an already-compressed file. Opening a JPEG, making no changes, and saving it again at 85% quality adds a round of compression to something already compressed. Each cycle degrades quality. Always compress from the original source file (RAW, HEIC, PNG, or the first JPEG export).

Using PNG for photographs. PNG uses lossless compression, which is great for graphics but wasteful for photos. A photograph saved as PNG can be 10-20 MB. The same image as a JPEG at 90% is under 1 MB and looks identical. PNG is for screenshots and logos, not photos.

Ignoring dimensions. A 4K photo (3840x2160) rendered in a 400px thumbnail is wasting 95% of its pixels. Resize first, then compress. This one step often reduces file size by 80% or more.

The bottom line

For photographs: JPEG at 85% or WebP at 80%. Resize to actual display dimensions first. That combination gives you the smallest file with no visible quality loss.

For graphics, logos, and screenshots: PNG or WebP lossless. The sharp edges and flat colors in these images compress well with lossless methods.

For maximum compatibility: JPEG. For maximum efficiency: WebP. For maximum quality: the original file.

Compress Images — Free