Key takeaways
- Lossy formats (JPEG, lossy WebP, AVIF, HEIC) trade data for file size; lossless formats (PNG, GIF, lossless WebP) keep every pixel.
- Match the format to the job: photos to JPEG/WebP/AVIF, graphics and text to PNG, simple flat-colour animation to GIF, cutting-edge delivery to AVIF.
- Modern formats beat JPEG on file size at equal quality, but software support — not compression — decides when you can actually switch.
- File extensions lie: verify a real format by opening it or checking metadata, never by the name alone.
- Compression cannot be undone: convert from originals, keep lossless masters, and treat every lossy re-save as a small permanent loss.
How Image Compression Works
Every image is a grid of pixels — each pixel stores colour as three or four numbers: red, green, blue, and optionally alpha (transparency). A 4000×3000 photograph has 12 million pixels, and at 4 bytes per pixel (RGBA) that is 48 MB of raw data. Compression exists to make that number tractable.
There are two fundamental strategies. Lossless compression reorganises the same data more efficiently (DEFLATE, used by PNG; LZ-Hi, used by WebP lossless; Lempel-Ziv-Welch, used by GIF) so the file is smaller but reconstructs every original pixel exactly. Lossy compression permanently discards data the human eye is unlikely to notice (JPEG's DCT quantisation, WebP's VP8 prediction, AVIF's AV1 intra coding) and achieves far smaller sizes at the cost of mathematical accuracy.
The practical difference: lossless formats can be re-saved infinite times without degradation. Lossy formats degrade every re-save because they quantise the same data again — the equivalent of photocopying a photocopy. This is why your saved-and-reopened JPEG looks slightly worse each time, while your PNG does not change.
JPEG (JPG) — The Photographic Workhorse
JPEG (Joint Photographic Experts Group) was finalised in 1992 and remains the single most-used image format on the internet. It uses lossy compression based on the Discrete Cosine Transform: the image is divided into 8×8 blocks, each block is converted from spatial frequencies into a set of coefficients, and small coefficients — representing detail the eye cannot perceive — are rounded to zero.
Strengths: universally supported, efficient on photographic content (10:1 compression ratios with minimal visual loss at quality 85), progressive mode allows a blurry-to-sharp render, and the format is decades of engineering-tuned.
Weaknesses: no transparency, ringing artefacts around sharp edges (text, UI elements), colour banding in gradients at low quality, and generation loss on every re-save.
Best for: photographs, portraits, landscapes, product shots, any image with continuous tones and no flat-colour edges.
PNG — Lossless Precision
PNG was designed in 1995-1996 as an open replacement for GIF after Unisys tried to enforce a patent on GIF's LZW compression. It uses the DEFLATE algorithm (the same math behind ZIP files) combined with per-row predictive filtering to achieve 20-60% compression on images without losing any data.
PNG comes in two variants that matter: PNG-24 (true colour, 16.7 million colours, no transparency) and PNG-32 (true colour + 8-bit alpha channel). PNG-8 (256-colour palette + binary transparency) exists but is rarely used.
Strengths: perfectly lossless, 8-bit alpha transparency, no generation loss, universal support, handles text and flat colour without artefacts.
Weaknesses: enormous file sizes on photographic images, no built-in progressive loading (the whole file must download before the image renders on most browsers), and no rotation metadata.
Best for: logos, icons, UI mockups, screenshots, scientific images, anything with sharp edges or transparency.
GIF — Animated Classics
GIF (Graphics Interchange Format) was created by CompuServe in 1987. It uses LZW compression and a palette limited to 256 colours. That limitation is both its defining weakness and the source of its charming lo-fi aesthetic.
GIF's enduring relevance is animation: it was the only widely-supported animated image format on the web for 25 years. Each frame is a full image, and inter-frame compression is minimal (only fully transparent pixels between frames save space), making GIF files large for their visual quality.
Strengths: animation without video players, binary transparency (a single palette colour can be transparent), universal support.
Weaknesses: 256 colours causes dithering/banding in photographs, no alpha transparency (fully transparent or fully opaque — no smooth edges), large file sizes.
Best for: simple animations, memes, loading indicators, pixel art. For most animation use cases in 2026, MP4 or WebM video is 5-10× smaller with better quality.
WebP — Modern Compression
WebP was released by Google in 2010 as a single format covering both photographic and graphic needs. It derives from VP8 (the same video codec behind WebM video) and supports lossy mode, lossless mode, transparency, and animation.
At matched quality, WebP lossy is 25-35% smaller than JPEG. At matched quality, WebP lossless is 26% smaller than PNG. It does not beat either format in their own territory by an enormous margin, but its advantage is being one format that handles all cases competently.
Browser support: universal since 2020. The only remaining gaps are email clients and very old software.
Best for: web images in general — photographs, graphics, transparent images, and simple animations. The default web format for new content in 2026.
AVIF — The Cutting Edge
AVIF (AV1 Image File Format) is based on the AV1 video codec — the same compression technology behind YouTube's 8K streams. Released in 2019 by the Alliance for Open Media (the consortium behind WebM and VP9), AVIF achieves 15-25% better compression than WebP at equivalent visual quality.
It supports 12-bit colour depth (vs WebP's 8-bit), HDR metadata, film grain synthesis (preserving the look of noisy film stock without storing noise), and alpha transparency in both lossy and lossless modes.
Browser support: Chrome, Firefox, Edge, and Safari 16.4+ (March 2023). iOS 16+ and Android 12+ handle it natively. However, older Windows and Linux software still needs codecs installed.
Best for: when you need the absolute smallest files and can provide a fallback. Photography websites, image CDNs, and any site with Core Web Vitals performance targets where those extra 15% savings compound across thousands of images.
HEIC / HEIF — Apple's Camera Format
HEIC (High Efficiency Image Container) uses H.265/HEVC video compression for still images. Apple made it the default iPhone camera format in iOS 11 (2017) because it stores the same quality photo as a JPEG at roughly half the file size — critical for 12-megapixel cameras filling 64 GB phones.
HEIF is the container format; HEIC is the image coding within it. HEIF also supports image sequences (burst shots, Live Photos), depth maps, and computational photography metadata that JPEG cannot represent.
The problem: compatibility. Windows users cannot open HEIC files without installing extensions from the Microsoft Store. Many websites, email clients, and third-party apps reject .heic files. This is why "convert HEIC to JPG" is one of the highest-volume image searches in the world.
Best for: storing photos on Apple devices where the Photos app handles it transparently. Convert to JPEG or WebP before sharing outside the Apple ecosystem.
SVG — Vector Graphics
SVG (Scalable Vector Graphics) stores images as XML markup — paths, shapes, gradients, and text — rather than a grid of pixels. This means an SVG can be rendered at any size without quality loss, which is the fundamental difference from every raster format above.
A logo saved as SVG is typically 2-5 KB. The same logo as a 1024×1024 PNG might be 15-30 KB. And the SVG looks identical at 16×16 favicon size and on a 4K billboard.
Weaknesses: SVGs cannot represent photographic content efficiently — a photo encoded as individual pixel paths would be enormous. They are also scriptable (can contain JavaScript), which makes accepting SVG uploads a security risk.
Best for: logos, icons, illustrations, charts, and any graphic that must scale to any resolution without becoming blurry.
TIFF and BMP — Legacy and Professional
TIFF (Tagged Image File Format) is a container primarily used in professional printing and scanning workflows. It supports multiple pages (multipage TIFF = primitive document format), lossless LZW compression, and 16-bit colour depth.
BMP (Windows Bitmap) is essentially uncompressed pixel data with a tiny header. It was designed in 1991 for Windows 3.0's GDI subsystem. Today it has almost no advantage — PNG does everything BMP does, smaller.
Neither is practical for web delivery. If you receive a TIFF or BMP, convert it to a modern format immediately.
Quick Reference: Format by Use Case
This table summarises the entire guide into a decision you can make in seconds:
- Website hero image / blog photo → WebP (lossy, quality 80)
- Logo or icon → SVG (scalable) or PNG-32 (if raster is needed)
- Email attachment / universal compatibility → JPEG (quality 85)
- Screenshot with text and UI → PNG or lossless WebP
- Product image with transparent background → PNG-32 or lossless WebP
- iPhone photo to share with others → Convert HEIC to JPEG or WebP
- Simple animation / meme → GIF (compatibility) or MP4 (quality + size)
- Print-ready / professional workflow → TIFF or high-quality PNG
- Maximum compression / next-gen web → AVIF with WebP fallback
- Raw photo archival → Lossless format (TIFF, PNG, or lossless WebP)
Frequently asked questions
The questions people ask most about image formats explained: jpg, png, gif, webp, avif, heic, answered directly.