Image formats

Formats differ in how they compress a picture. JPEG discards detail the eye is unlikely to miss, which suits photographs. PNG is lossless and keeps every pixel, which suits screenshots, logos and sharp edges, but makes photos large. SVG describes shapes as code instead of pixels and stays sharp at any size. The newer formats WebPWebPAn image format developed by Google, lossy or lossless, with transparency and animation. It is clearly smaller than unoptimised JPEG but only slightly smaller than a well-optimised one.In the glossary, AVIFAVIFAn image format based on the AV1 video codec. At the same visual quality its files are usually clearly smaller than JPEG and WebP, and all current major browsers display it.In the glossary and JPEG XLJPEG XLAn image format standardised as ISO/IEC 18181, clearly smaller than JPEG, that can also repack existing JPEG files losslessly. Chrome from version 155 and Firefox from 158 support it, Safari only in part, so a fallback format remains necessary.In the glossary can work either lossy or lossless and support transparency. AVIF is derived from the AV1 video codec, and JPEG XL can repack an existing JPEG without any loss.

Images are the largest part of the typical page: 911 KB of the 2.56 MB that the median mobile home page transferred in 2025 (Web Almanac). The older formats still dominate: in 2024, 32.4 percent of all images on mobile pages were JPEG and 28.4 percent PNG, against 12 percent WebP and 1.0 percent AVIF.

How much smaller the newer formats are depends on the JPEG they are compared with. In Google's own study, lossy WebP was 25 to 34 percent smaller than JPEG at the same SSIM score, but its JPEG files came from the plain reference encoder libjpeg 6b. Against the optimised encoder mozjpeg, WebP saves only about 3 to 5 percent, according to Jon Sneyers of Cloudinary, while AVIF saves a further 10 to 15 percent over WebP.

The ranking also shifts with the quality level. AVIF does best at low quality and JPEG XL at medium to high quality, while WebP at high quality sometimes does worse than JPEG, partly because it cannot store colour at full resolution. For lossless images, Google measured WebP 26 percent smaller than PNG. Results also vary with the motif, the encoder and the quality metric, so a single percentage is an average over many photos and can miss a particular one by a wide margin.

The pixel dimensions often matter more than the format. A photo 3,000 pixels wide in a phone column of 400 pixels wastes most of its bytes. A page should therefore offer several widths and let the browser choose with srcset and sizes; in 2024, 42 percent of mobile pages used srcset. The <picture> element lists formats in order of preference, and the browser takes the first one it can display, which lets a site deliver AVIF with a fallback to JPEG. Width and height in the markup reserve space and prevent the layout from jumping.

Every meaningful image also needs alt textAlt textA short text alternative for an image, written in its `alt` attribute. Screen readers read it aloud and search engines use it; purely decorative images get an empty one.In the glossary. A screen readerScreen readerSoftware that reads the content of a screen aloud or sends it to a braille display. It depends on headings, labels and text alternatives in the code.In the glossary reads it aloud, and search engines use it to understand the picture. In 2024, 45 percent of <img> elements on the web had no alt text at all.

WebP works in every current browser. AVIF has been supported since Chrome 85, Firefox 93 and Safari 16.4, and reaches about 97 percent of users worldwide according to Can I use. JPEG XL is fully supported in Chrome from version 155 and Firefox from version 158, but only in part in Safari. That puts it at about 69 percent of users, so it still needs a fallback format.