Next-gen image formats

Home / Website / Next-gen image formats

Image files are meant for organizing and storing digital images. Image file formats store the data in compressed and uncompressed (which may be lossy or lossless) formats. The image formats which we use regularly are PNG (Portable Network Graphics), JPEG (Joint Photographic Expert Group), SVG (Scalable Vector Graphics) etc. If you’ve run a Google Pagespeed Insights report on your website recently it’s likely that you’ve seen “serve images in next-gen formats” as a recommendation. Next-gen image formats are file formats that often include compression information embedded in modern browsers that allow website images to be loaded faster. 

WHAT ARE NEXT-GEN IMAGES?

Next-gen – short for ‘next generation’ – image formats are modern file types that boast impressive quality and advanced compression capabilities compared to the traditional JPEG, PNG, and GIF. They produce smaller sizes, which means they can help significantly increase the speed of webpages.

The most common types are:

JPEG XR: The standard format for enhanced HDR images. JPEG XR uses more enhanced compression techniques than the original JPEG.
JPEG 2000: This is the newest iteration of the JPEG image format. It uses lossless compression with minimal sacrifice to visual quality.
WebP: Supports both lossy and lossless compression. WebP lossless images are almost 30 percent smaller than PNG and JPEG files. 

* Not every browser supports all types of next-gen format. For example, while Chrome and Firefox can load WebP files, Safari doesn’t support WebP yet. Conversely, Safari can display JPEG 2000 images but Firefox and Chrome cannot.

THE BENEFITS OF USING NEXT-GEN IMAGES Most of us are probably aware that images account for much of the loading time on websites. This is why optimizing them through compression is strongly recommended. WebP images are about three times smaller than other formats while including the same capabilities of PNGs, JPEGs, and GIFs. This means that  they support both transparency and animation.

 

Get Quote






    Close