WebP is a relatively new image format that many developers and SEO tools recommend over JPEG or PNG. Because the image size of WebP is significantly smaller than those of these legacy formats, page loading time is significantly reduced. However, WebP has significant limitations, and I'd like to explore when to utilize WebP and I'd show you a better alternative.

WebP could be used if the image is not supposed to be downloaded

I thought the WebP was fantastic, and I used it on a website. Users on the website, on the other hand, were perplexed because they couldn't download JPEG images but could only download WebP files, which aren't supported by many image viewers. I came into a similar situation here (Images save as WEBP file now when right clicking to download), and I believe this is a rather common problem. The Shopify staff suggested that consumers use tools to obtain JPEG files in the community forum mentioned above. However, as a developer, I feel we should not compel users to take additional actions.

The major issue with WebP, in my opinion, is that if your image viewer doesn't support it, the image will only be available on your web browser. As a result, the use case should be restricted to a loading image or other non-downloadable content. Also, some WebP images appear blurry or are presented with odd colors, which I noticed. I've never had a problem like this with JPEG or PNG.

Better solution for the image optimization

The mozjpeg JPEG encoder is a better JPEG encoder that achieves good image optimization. There are several encoder alternatives, but I like mozjpeg.com because it's simple to use and allows for image editing such as resizing. The image format is still JPEG, so it can be used by a wide range of people and use cases. To summarise, I believe that mozjpeg is a far superior choice for picture optimization than WebP.

Disclaimer: I'm not an expert on image encoders, so I might be wrong. I'd really appreciate it if you have better ideas and share them with us.