How to Effectively use WebP For Shopify Speed Optimization

By Bhavesha | 5 min reads

What is WebP?

It is a next-generation image file format that offers exceptional compression capabilities. This is a superior image format developed by Google. For web images, it supports lossless compression and lossy compression (as well as transparency). When you’re attempting to compress an image, you should use WebP.

Do you know if your Shopify Website Serves WebP Images?

You can easily check whether your Shopify Store is successfully serving WebP images.
This will be described in a very similar manner on any browser, but we will demonstrate it using Chrome.
  1. Put images from your store on a page.
  2. Go to the Chrome menu, go to More Tools, and then click on Developer tools.
  3. The rendered image format will appear under Type when you refresh the page and click on network.
dentification-for-shopify-serving-WebP-images

How to Upload WebP Images in Shopify?

When you upload your files in JPG or PNG format, Shopify will serve them in WebP format for all supported browsers (Chrome, Safari, and Opera).

JPG Images Instead of WebP images

If your customer’s browser does not support webP, Shopify will display JPG format automatically. In all other cases, however, a webP file format will be loaded, there is no option to disable it manually.
WebP is simply superior to Jpeg and will improve the performance of your store.

In Shopify, How can I save Web Images as JPG or PNG Instead of WebP?

You will see that you are downloading a web file when you right-click an image of your Shopify Store. How do you convert that to a JPG?
You have two options:
  • You can open your store with a browser that does not support webP. (Internet Explorer).
  • You can use Windows by renaming the file extension to .jpg.

Benefits of WebP Image Format For Shopify Store

  • i) Faster loading of Shopify stores
  • ii) Reducing the size of the image with no effort
  • iii) Images of high quality
  • iv) support animation and transparency

WebP Disadvantages

Why do we still use other image formats if WebP is so amazing?
  • There are some browsers that do not support webP.
  • Finding an image editor software can be challenging (Visual Editor).

Shopify Speed Optimization Service Packages

To improve the speed of your Shopify site with our speed optimization packages Contact Us. We can assist you in choosing the services that will help you.

divide
Choose your Shopify Optimization Plan Basic Web Vitals
Prices (in USD) $150 $429
Pass the Google Core Web Vitals – Real User Experience (Product Page)***
6 Months Support
Google PSI Homepage Score * (For Desktop) 50-60 Pass Web Vitals***
Google PSI Product Page Score ** (For Desktop) 50-60 Pass Web Vitals
Google PSI Homepage Score * (For Mobile) 40-50 Pass Web Vitals***
Google PSI Product Page Score ** (For Mobile) 40-50 Pass Web Vitals
Reports
Free SEO Audit
Optimize My Site Optimize My Site
*Few Shopify Apps are known to reduce score and increase load time due to higher JS payload. In case during our Optimization we find such Apps we will inform about the App and communicate with App providers and get it resolved or recommend an alternative App as a solution.
**Higher JS payload due to Apps result in lower Google Page Speed Insights( PSI ) score specially for mobile. Hence while we guarantee score improvement we can guarantee achievable score by alternate App usage or some custom shopify coding.
***May require design and functionality change.
get in touch

Leave A Comment