WebP

In short: A modern image format developed by Google, supporting both lossy and lossless compression.

In more detail: Usually achieves smaller file sizes than JPEG or PNG at similar visual quality, and also supports transparency and animations. Increasingly used on the web as the default format for images, to reduce load times.

In Depth

WebP combines in a single format properties that previously required two separate formats: lossy compression like JPEG (good for photos, smaller files through loss of detail) AND lossless compression like PNG (perfect pixel accuracy, but larger files) — the appropriate mode can be chosen depending on the use case. WebP also supports transparency (an alpha channel, like PNG) and simple animation (like GIF), but with considerably better compression than either.

For websites, this means in practice: the same image quality at a 25-35% smaller file size compared to JPEG, which directly leads to faster load times — a measurable factor both for user experience and for search-engine rankings (Google explicitly counts load speed as a ranking factor). Modern image optimisation pipelines (e.g. Next.js’s built-in <Image> component) automatically convert uploaded JPEGs/PNGs to WebP (or the even newer AVIF), if the visitor’s browser supports it — practically all current browsers now do; older browsers automatically get a JPEG/PNG fallback.

Technical foundation

WebP is technically built on the VP8 video codec, which Google acquired in 2010 through its acquisition of On2 Technologies and released as an open, royalty-free standard — the basic idea was to apply the same compression technique developed for individual video frames to individual still images too. This explains why WebP, with similar compression logic to modern video codecs, often works more efficiently than the considerably older JPEG format (which is based on compression technology from the early 1990s).

AVIF as the next generation

For a few years now, AVIF (based on the AV1 video codec) has established itself as an even newer, usually somewhat more efficient image format, as a successor to WebP — often another 10-20% smaller files at comparable quality. The downside: AVIF encoding is considerably more computationally intensive than WebP, which can matter for image processing on the server (e.g. automatically converting many uploaded images). Many modern image optimisation pipelines therefore offer both formats and automatically deliver the most efficient format the requesting browser supports.

Practical use with <picture>

For maximum compatibility, the HTML <picture> element is often used, offering the browser several format options and automatically choosing the best supported one:

<picture>
  <source srcset="image.avif" type="image/avif" />
  <source srcset="image.webp" type="image/webp" />
  <img src="image.jpg" alt="Description" />
</picture>

See also: JPEG