JPEG is the most common format for photos on the web. It makes image files small by quietly throwing away detail your eye is unlikely to miss, so a photo that would be huge in other formats becomes quick to download. The files end in .jpg or .jpeg; both are the same thing.
How JPEG compression decides what to discard
The name comes from the Joint Photographic Experts Group, which published the standard in 1992. A JPEG encoder splits the picture into 8 by 8 blocks of pixels, converts each block into a set of frequencies with a mathematical step called the discrete cosine transform, and then rounds off the fine, high-frequency detail. It also stores colour at lower resolution than brightness, because human vision is more sensitive to light and dark than to hue.
The quality setting, usually 0 to 100 in export dialogs, controls how aggressive that rounding is. Push it too low and you see blocky squares and smudgy halos, called compression artefacts, around sharp edges. Every time a JPEG is edited and saved again, it is compressed again and loses a bit more.
A typical example: a photographer's portfolio
A wedding photographer exports gallery images straight from the camera at full size and maximum quality. Each file is several megabytes and the gallery crawls on a phone. Re-exporting at around 2000 pixels wide and a quality near 80 produces files that look the same on screen at a fraction of the weight. The improvement shows up directly in Largest Contentful Paint when the hero is a photo.
When JPEG is the right choice
Choose JPEG for photographs, product shots and textured backgrounds. Avoid it for logos, screenshots and images containing text: the blur around hard edges is obvious, and JPEG has no transparency. Those belong in PNG or SVG. JPEG's advantage is that every browser, email client and phone opens it, though WebP and AVIF now give smaller files at similar quality where support allows.
Common JPEG mistakes
- Exporting at quality 100. The file grows a lot while the visible difference from about 80 is minimal.
- Repeatedly editing the same JPEG. Keep an original and export a fresh copy instead of re-saving.
- Putting a logo on a coloured header as JPEG. You get a white box behind it because there is no transparent background.
- Forgetting about orientation data. Phone photos store rotation in metadata, and some tools strip it, leaving images sideways.
Related terms
- PNG: lossless alternative for graphics and text.
- WebP: a modern format that usually beats JPEG on size.
- Lazy loading: delays photos further down the page.
- Pixel: the unit JPEG groups into blocks.