WebP images are your chance to ensure your Shopify website images are not only stunning, but also optimized for performance.
While you want a fair share of images on your Shopify store, you don’t want to sacrifice store speed. To keep the balance, you need to reduce image size as much as possible.
This is where WebP image format comes in. In this guide, we will explore what WebP is, how it works, how it can benefit your web and what to look out for.
Let’s get straight to it.
What is WebP?
WebP is a next-generation image file format that provides exceptional image compression possibilities. It incorporates both lossy and lossless image compression methods to reduce image file size up to 34% more than JPG and 26% more than PNG files.
Crafted by Google back in 2010, WebP is about to become one of the leading formats for web images. And how can it not be when this image format is designed to provide rich images in small sizes to make your website faster.
Although it appeared over a decade ago, it started taking the web by storm only somewhat recently. All major browsers, such as Chrome, Safari and Opera, now support WebP, so more and more websites can enjoy its benefits without technical issues.
What is it about WebP that makes it exceptional?
Let’s take a look at main advantages of WebP image format:
- Improves website speed. If not optimized, visuals will slow down the website drastically. With image compression possibilities that surpass JPG and PNG, WebP is by far the most effective image format for fast load times.
- Requires less space for media storage. Smaller images mean less media storage space. This is especially relevant for websites that rely on visuals and pay for unlimited storage web hosting plans as it allows to cut down on these costs.
- Supports animation and transparency. WebP brings the best of all image formats together. Animated elements from GIF and transparent elements from PNG are both supported by it.
- It’s an open source image format. Do you think WebP can be improved even more? Great, because it’s open source, meaning anyone can contribute and offer their input.
Do you want to test the power of WebP? Use our online converter tool!TinyIMG WebP Converter
If WebP is that amazing, why do we still bother with other image formats?
Well, as it turns out, it’s not entirely perfect. Take these WebP disadvantages into consideration before adopting WebP image format:
- Not all browsers support WebP. At this point, every major browser with display WebP files. Yet there are still a couple, such as Internet Explorer, that don’t allow you to view WebP images.
- Finding an image editor program can be a challenge. Not that many visual editor programs will allow you to make changes to WebP images or save your work as WebP files.
All things considered, these issues are a small price to pay for the benefits that WebP image format brings to the table.
WebP images and Shopify
Shopify adopted WebP back in 2019, and this is how they handle WebP image format:
- You can upload WebP files to Shopify (supported formats are JPG, progressive JPEG, PNG, WebP, and GIF).
- Regardless of uploaded image format, Shopify will automatically render uploaded images as WebP if your customer’s browser supports it.
Some time ago, Shopify wouldn’t allow uploading WebP files. They didn’t want to risk your product images breaking if the user's browser doesn’t support WebP format. At this point, it’s a non-issue since pretty much all browsers have adapted to WebP, so you can conveniently use WebP format for upload as well.
Optimizing JPG and PNG still matters! Let TinyIMG take care of all image optimization on your store.Optimize images now
How to know if your Shopify web is serving WebP images?
Checking whether your Shopify store is serving WebP images successfully is very simple.
We’ll quickly walk you through this on Chrome, but you can do this on any browser in a very similar manner.
1. Open a page of your store with images.
2. Open Chrome menu, go to More Tools and click on Developer Tools.
3. Refresh page, click on Network and you will see the rendered image format under Type.
Benefits of WebP image format for Shopify store
You might not even notice, but this image file format is doing a lot of good for your store.
Here is a rundown of the benefits that WebP image format provides for Shopify stores:
- Faster Shopify store load time. And a faster store leads to better rankings, more conversions and happier shoppers.
- Smaller image size with zero effort. WebP will compress your product photos without you having to lift a finger.
- High-quality product images. WebP does not sacrifice quality for smaller file size. All of your products will be featured with top-quality visuals only.
Can you make Shopify show JPG images instead of WebP format?
If you upload your original files in JPG, Shopify will show JPG format automatically if the browser of your customer does not support WebP. However, in all other instances a WebP file format will be loaded, there is no option to manually disable it.
But you wouldn’t want to. WebP is simply superior to JPG and can be trusted to improve your store’s performance.
How to save Shopify web images as JPG or PNG instead of WebP?
If you right-click an image of your Shopify store, you will see that you’re downloading a WebP file. How do you switch that to JPG?
You have a couple of main options:
- Save them as WebP files to your device, then use WebP to JPG converter.
- Open your store with a browser that does not support WebP, for instance, Internet Explorer. You will be served the original image file format.
- If you’re using Windows, rename the file extension to .jpg
Frequently asked questions
Shopify serves WebP images automatically since 2019 for all files uploaded in JPG or PNG format.
Yes, WebP image format offers smaller image size and better compression possibilities. However, be aware that not all browsers support WebP files.
Yes, you can. Accepted Shopify image formats are WebP, JPG, PNG, and GIF. However, Shopify will always serve WebP images to your Shopify website visitors if their browser supports it.
On top of file size and image quality, you need to take care of aspects such as ALT texts. Consider getting TinyIMG, a complete Shopify image and SEO optimization app to take care of all your image optimization needs.