What is Best Image Format For Web? Which one to choose?

Average mobile webpage is 2.2MB and 68% of it is images. So image has huge importance for web page speed. Well image’s format has any effect on that. First lets see what kinds of image formats are widely used on web.

JPG/ JPEG (Joint Photographic Experts Group)

JPEG is lossy format so it always has some loss of quality when using this format. But it is most compatible format for web. Nearly all of the browsers are supporting JPEG format.

GIF (Graphics Interchange Format)

GIFs are suitable for sharp-edged line art (such as logos) with a limited number of colors and can be used for animations and low-resolution videos.

PNG (Portable Network Graphics)

PNG supports palette-based images, grayscale images (with or without alpha channel for transparency), and full-color non-palette-based RGB/RGBA images (with or without alpha channel).

WebP

WebP is a method of lossy and lossless compression that can be used on a large variety of photographic, translucent and graphical images found on the web. The degree of lossy compression is adjustable so a user can choose the trade-off between file size and image quality.

WebP is an image format developed by Google. This format was designed to be used specifically on the web. Even though WebP has huge advantage for size of image, some of the browsers does not support WebP.

Which one to choose?

Size
Size varies according to image. Picture may have smaller size with WebP and logo/graphics have smaller size with PNG.

Compatibility
JPEG, GIF and PNG are supported by many common browsers. But even though WebP has size advantage, it is not supported by some browser.

image4io Auto Format Delivery

With this feature image4io users doesn’t have to decide which image format to use on development time. Web developers can work without thinking about their source image formats and which format to deliver their customers. image4io decide and deliver best option from any source format to best format via multi-CDN architecture.

Sources:

Originally published at https://image4.io on June 5, 2019.

MSc. Computer Engineer. Founder of @image4io, .NET Software Consultant @kloia_com, co-organizer in @serverlesstr, Community Builder of @awscloud.