What Is Image Compression? A Beginner Explanation

2026-10-06

Image compression does exactly one thing: describe the same picture with fewer bytes. A 4000 by 3000 photo from a phone holds tens of megabytes of raw pixel data, and the JPEG you actually share usually lands around two or three. This is written for someone meeting the idea for the first time, so no formulas, just what compression changes and when it starts costing visible quality.

What image compression actually changes

A bitmap is a grid of pixels, and each cell stores three numbers for red, green and blue. A compressor looks for repetition in that grid and writes a short description of the pattern instead of copying every cell. More repetition means more bytes saved.

• Spatial redundancy: a flat sky, a plain wall, a blurred background, where one line covers a whole region
• Coding redundancy: values that repeat often get shorter symbols, the same idea behind a zip archive
• Visual redundancy: eyes miss fine detail and small colour shifts, so those bytes can be recorded more coarsely

Compression is not resizing. The display size and the pixel count stay the same, and what shrinks is the number of bytes needed to record those pixels. Once you separate the two ideas, most of the confusion goes away.

Lossy and lossless compression compared

The two differ on a single question: does the decoded file match the original byte for byte. If yes, it is lossless. If not, it is lossy.

• Lossless: PNG, lossless WebP, LZW in TIFF. Decoding reproduces the original exactly, which suits screenshots, charts, and anything containing text
• Lossy: JPEG, lossy WebP, AVIF. Information the eye barely registers is dropped in exchange for a much smaller file, which suits photographs
• Lossy formats accumulate damage, since opening a JPEG and saving it again removes another layer of detail each time
• Keep a lossless or original copy while you edit, and export to JPEG only as the final step

What the common image formats do

• JPEG: lossy, the default for photographs, no transparency
• PNG: lossless, supports transparency, right for interface screenshots and line art, far too large for photos
• WebP: both lossy and lossless, usually smaller than JPEG at matched quality, supported across current browsers
• AVIF: mainly lossy, compresses further, slower to encode, worth it for libraries that rarely change
• GIF: lossless but capped at 256 colours, fine for simple animation, wrong for photographs

When to compress and when to leave it alone

• Compress: images for a web page, email attachments, forms and portals that cap upload size
• Compress: photos you will only ever view on a screen, where the full resolution is never used
• Leave alone: anything headed for print or a large output, resample to the output size first and decide after that
• Leave alone: a JPEG that has already been compressed once, because a second pass saves little and costs visible quality
• Resize before compressing, since halving the long edge removes about three quarters of the pixels and beats any quality slider

Four mistakes beginners make

• Chasing the smallest file instead of checking the result at 100 percent zoom
• Using a screenshot instead of an export, which locks the resolution and drops colour data
• Overwriting the original, instead of keeping one untouched master and compressing a copy
• Ignoring the transferred column in the network panel, the only place that shows what readers actually download

To try it, image-compressor-saas.shop compresses inside the browser so images never reach a server. Target an exact size with /blog/compress-jpg-under-100kb, see how bytes relate to load time in /blog/image-compression-affects-page-speed, and get the resize-then-compress order right with /blog/resize-and-compress-image.