Web image formats

The image file formats that are most commonly used on the web are listed below.

Classic image formats

These are the classic image formats universally supported in all web browsers

• GIF – Animating the web since 1987. Bad for photos, great for icons. Universally supported.
• JPEG – A compressed image format used throughout the web, particular adept at displaying photos. Universally supported.
• PNG – Adoption picked up after IE6, now universal. Lossless compression with alpha transparency.

Intermediate

More recent additions to the list of browser-supported image formats:

• SVG – A vector format, ideal for UI elements that must be drawn accurately at different sizes. Supported in Chrome, Edge, Firefox, IE, Opera, Safari.
• APNG – Where GIF and PNG meet is the Animated PNG. They are supported in Chrome, Edge, Firefox, Opera, Safari.

Older/deprecated formats

Best avoided, these formats don’t have wide support and have been replaced with better alternatives.

• BMP – Bitmap File supported by Chrome, Edge, Firefox, IE, Opera, Safari. Best left for use with Microsoft Paint and not used online.
• ICO – Microsoft Icon format supported by Chrome, Edge, Firefox, IE, Opera, Safari. Usage now should be limited to favicon.ico, and not used in web content.
• TIFF – Tagged Image File Format supported by Safari, typically on the larger size, usually uncompressed.

Modern image formats

Newer image formats enjoy much better performance than classic formats. Support is better than it was, and support is now almost universal amongst the most popular browsers.

• AVIF – Good alternative for images and animated images. Better compression than PNG or JPEG but you should include fallback formats for better browser support. Supported: Chrome, Opera, Firefox (still images only: animated images not implemented).
• WebP – Excellent choice for both images and animated images. Better compression than classic formats and broad support in Chrome, Edge, Firefox, Opera, Safari

AVIF and WebP are image formats that have superior compression and quality characteristics compared to their older JPEG and PNG counterparts. Encoding your images in these formats rather than JPEG or PNG means that they will load faster and consume less cellular data.

Updated 22/9/22

Converting to modern image formats

As Google and other search engines increasingly attribute page speed with quality, it is important that your website loads as quickly as possible. Depending on how heavily you use images on your website or ecommerce store it might be useful to consider options to switch your website to use modern image formats:

• Magento WebP Image Plugins
• WordPress WebP Image Plugins