Table of contents

    Images are an important part of any website. They play a big role in how users perceive your site. They can also affect SEO ranking.

    Which image formats are therefore best for SEO? This is a question that many site owners struggle with. There are many factors to consider here. In this article, we’ll explore the new image formats that can be used today, and examine how they can help improve your site’s Core Web Vitals So indirectly, also increase the effectiveness of your site’s SEO.

    modern image formats for seo

    Core Web Vitals are among the most important ranking factors used by Google, and the elements that contribute to them are the sizes and formats of your images.

    In this article, we will discuss a selection of newer image formats that can help improve your site’s Core Web Vitals score. These new formats include MozJPEG, JPEG XL, WebP and AVIF.

    So which format should you choose? Let’s find out!

    Search Engine Optimization

    Search Engine Optimization, or “SEO” for short, is the process of improving a website’s visibility and position on search engine results pages (SERPs). This is achieved by optimizing a website for certain key factors (on-site) and off-site activities (such as those related to link acquisition). One of the factors belonging to the on-site group is images.

    Image formats on-sites

    We have already told what SEO (in simple terms) is, and why image optimization matters. Under optimization, we can talk about format, size or the way graphics load, among other things. In this article we will focus on the first of these.

    JPEG image

    The JPEG image format was created in 1992 and is characterized by its ability to reduce file size while maintaining a high level of quality. It is still widely used today because it offered a good balance between file size and image quality.

    However, the JPEG format is not as efficient as some of the newer formats available, so it is not always the best choice for SEO. JPG images can be quite large, which can have a negative impact on page load time.

    MozJPEG

    According to Mozilla, WebP and JPEG XR did not represent a significant leap over the well-optimized JPEG. Only HEVC (H.265) proved in the study significantly better, but it is a patented format that cannot be used freely due to its status.

    In response, Mozilla created the MozJPEG library in 2014 as an improved version of the JPEG image format. It offers better compression and higher quality than the JPEG format, making it an interesting choice for SEOs. At the same time, it is fully compatible with the JPEG standard and almost all JPEG decoders.

    The MozJPEG library was not widely used until the introduction of version 3, which significantly improved several shortcomings of its predecessor (including improved image quality, wider compatibility). For details, I refer here.

    JPEG XL

    The JPEG XL image format was introduced in 2021 as an improved version of the JPEG image format. It offers better compression, higher quality and faster decoding than the JPEG format. However, it is not yet widely supported by browsers and devices. According to the CanIUse portal, the JPEG XL format does not support any web browser by default.

    Despite this, JPEG XL is a very interesting format with excellent decoding time and quality. Its pain point is its ubiquity.

    Particularly in the case of JPEG XL.

    AVIF

    AVIF (Audio Video Interleaved Format) is a new image format that was created by the Alliance for Open Media in 2019. It offers better quality and faster decoding than the JPEG format. However, it is not yet widely supported by browsers and devices. According to the CanIUse AVIF improvement portal, this format can display  71.62% of internet users.

    Supporting the AVIF format on Windows requires installing the free AV1 Video Extension codec and HEIF Image Extension (both available from the Microsoft Store).

    WebP

    WebP, or WebP Image Format, is a new image format developed by Google in 2010. It offers better quality and faster decoding than the JPEG format. It is not JPEG XL, but it has the advantage of already being widely supported by browsers and devices. According to the CanIUse WebP improvement portal, this format can display almost 97% of users.

    This at very good compression and quite good quality. It is, however, inferior in quality to JPEG XL, among others.

    It is a very good quality.

    Image-size-dependent-on-format

    Time to test the size of images. The test is not perfect, but it shows some dependencies. To speed up the process in each case, compression was configured at 80% (where possible).

    A 1661 x 1661 image in JPEG format was compressed. The initial size of the image was 1.30 MB.

    The initial size of the image was 1.30 MB.

    Here are the compression results depending on the format (I encourage you to read the comments underneath):

    • WebP 81.8 KB
    • MozJPEG 124 KB
    • JPEG 154 KB
    • JXL 110 KB
    • AVIF 57 KB
    • JP2 2.27 MB

    I intentionally arranged the above ranking in a different order. WebP was, besides the best compression, the format that worked right from the start. There was no need to install anything. The existence of ready-made plug-ins to automatically convert uploaded images is also a big advantage.

    The second place went to MozJPEG – acceptable size and universality of 100%. Unfortunately, the downside is the need for manual compression. Here I used the library version 4.0.3. For convenience, I used MozJPEG.GUI.

    No. 3 without much commentary – standard JPEG.

    The fourth place went to JPEG XL (JXL). Best quality and low commonness. Rather as a complementary format. Nevertheless, the most promising. Choosing JPEG XL read how to use several formats simultaneously For example, we can use the tag picture with consecutive elements src and img

    AVIF provided the most problems. It required additional tools to be installed. Photo viewing programs displayed a red bar on AVIF photos. In the browser, on the other hand, it was ok. Conversion to AVIF had to be done online.

    Picture quality test after compression

    Ideally, it was still possible to do the test assuming a fixed size of the resulting image. Such as here Thus, to the work. Since in the tool you can most often (except for JPEG) only set the compression ratio, not the resulting size, I’ll limit myself here to a few of the best formats: WebP, MozJPEG, JPEG, JXL and AVIF.

    The graphic to be analyzed will be a background filled with a multicolor gradient and text. The starting graphic has 740 KB and a size of 1697 x 727 pixels. As a result, I want to get a file size of 30 KB.

    • JXL: very good text readability and image quality
    • AVIF: very good text legibility and image quality; slightly different colors
    • WebP: very good text readability and image quality, minor gradient smoothness issues, observable problems on corners of rectangle
    • MozJPEG: good text readability, gradient smoothness issues, problems at corners of rectangle
    • JPEG: average readability, gradient loses smoothness, visible bars, big problems on corners of rectangle

    In this clash, WebP was the winner. The JXL and AVIF formats had the best quality, but so what if they are not widely supported.

    What image format to choose?

    Webp is currently the best image format for a website because it offers good compression and is widely supported. This means that the user will see the correct image, which is a good compromise between page load speed, image quality and accessibility.

    If images are a key part of the site, it is additionally worth considering JXL or AVIF formats using the method described in Google’s help (Google Search Center).

    If we are talking about the best format for images in terms of SEO, it would be impossible not to take into account the official position of Google.

    Google Graphics supports images in these formats: BMP, GIF, JPEG, PNG, WebP and SVG.

    https://developers.google.com/search/docs/appearance/google-images?hl=pl

    Another thing that speaks in favor of WebP and JPEG formats.

    Optimize images on the web

    Images are an important part of your website and should be optimized for the best user experience. There are many different image formats to choose from, each with its own advantages.

    Use the format that will provide the best results for your users and help improve your Core Web Vitals.

    Want to learn more? Contact us today! We can help you optimize your images and improve your site’s search engine ranking. We also encourage a comprehensive SEO service for your website. Until we hear from you!

    Let's talk!

    Piotr Starzyński
    Piotr Starzyński

    Hello! My name is Piotr Starzynski and it's a pleasure to meet you in the SEO industry. I have been officially working in SEO since 2006, while I have been working in analytics for several years. I have about 400 analytics implementations for client websites, hundreds of SEO projects and dozens of analytics projects for mobile applications. At Up&More, I am responsible for the Search Engine Optimization and Web Analytics team. If you feel like working with me, I invite you to contact me!