JPEG
JPEG is the compressed image format built for photographs, which throws away detail your eye is unlikely to miss in exchange for a much smaller file.
In plain English
A photograph saved as a JPEG is a fraction of the size of the original, because the format discards information rather than storing every pixel exactly. That is what lossy means.
It is the right choice for photos and the wrong one for logos, screenshots and anything with sharp edges or flat colour, which come out smudged. Those want PNG, or SVG if it is a shape.
Why it matters
Images are most of the weight of a typical page, and choosing the wrong format is the difference between a page that loads instantly and one that hangs on a phone.
Knowing which format does what also saves you from the two classic mistakes: a photograph saved as a PNG at ten times the size, and a logo saved as a JPEG with grey fuzz around the letters.
How it works
-
Compression is adjustableQuality around eighty is usually indistinguishable from the original at a fraction of the size.
-
Each save loses a little moreRe-saving a JPEG repeatedly degrades it, so keep the original somewhere.
-
There is no transparencyA JPEG cannot have a transparent background. That is a PNG or a WebP.
-
WebP does the same job smallerModern browsers all support it, and it handles transparency as well.
Resize before you compress
Compressing a four thousand pixel photo still leaves a four thousand pixel photo. Scale it to the size it will actually be shown at first, then compress.