How do I convert a JPEG to a WordPress WebP?
Shrink Image Files up to 35% in Size using WordPress WebP
If you are looking to speed up your WordPress site, compressing and reducing your images’ file size can be the best option to do so. On average, images typically accounts for 50% of an average web page’s weight. Anything you can do to optimize your images not only saves you space on your server but ensures performance. WebP can help you immensely with that!
Fortunately, with the WebP image format, you can create smaller, richer images 26% smaller in size than PNGs and 25-34% smaller than JPEGs — while keeping the same quality.
In this article, we’ll dive deep and look at what WebP is and how to use this image format on your WordPress site to reduce your images’ size dramatically.
What is WebP?
WebP created by the web performance team at Google is an image file format. It was developed as a replacement for JPEG, PNG, and GIF while supporting good compression, transparency, and animations.
WebP announced in September 2010 a new open standard for lossy compressed true-color graphics on the web. This had comparable quality to JPEG, and a smaller file size. The lossless and translucent images support came back in 2012, which made WebP a definite alternative to the PNG format.
What is WebP lossy and lossless Compression?
Lossy Compression follows the method of predictive coding to encode an image — it is the same method used by the VP8 video codec to compress video keyframes.
Lossless Compression reconstructs new pixels by using the seen image fragments and can use a local palette if no match is found.
Well if you run a PageSpeed Insights test, one of the many recommendations is to Serve images in next-gen formats like WebP:
How can WebP help you?
WebP images are smaller compared to their JPEG equivalents. This enables the visitors to view your sites complete page loaded more quickly.
Since smaller images take less bandwidth to transmit, your images still get all of the responsive benefits of srcset and lazy loading by default. Due to its wide range of browser support, you can start using them today.
Converting JPEG to WordPress WebP
WordPress doesn’t convert the original format to WebP by itself. However, you need to upload your webp files on the dashboard or use a plugin.
The easiest way is to use a plugin that automatically converts all your existing media images into webp format. These plugins convert your original photos to the WebP format while also adding the original file type as a fallback if, for some reason, the browser fails to render.
Lets look at the Plugin list that converts into WordPress WebP
1. Imagify
Imagify is one of the most popular image optimization plugins developed by WP Media. It offers WebP support! For every image, you optimize with Imagify. The plugin automatically creates a WebP version (if you enable it in settings); with a variety of options like:
- full-sized optimized image
- full-sized Webp
- thumbnails optimized
- WebP thumnails
These optimizations also work for the images included in your themes and plugins.
If you are looking to optimize lots of small images, Imagify is the perfect right option and affordable. It offers a free tier that is limited to 25 MB of optimizations per month. If you exceed the cap limit, paid plans start at $4.99 per month for up to 1 GB or $9.99 for a one-time credit of 1 GB.
To get started with Imagify, you’ll need to install the plugin from WordPress.org and add your API key. The next steps are to select the General Settings box to choose your compression level.
2. ShortPixel
ShortPixel is another WordPress image optimization plugin that can help you automatically resize and compress the images you upload to your WordPress site—starting with version 4.1 .
The limited free plan has a cap to optimize~100 images per month for free. Paid plans start at $4.99 per month for up to 5,000 images/credits or $9.99 one-time for a pack of 10,000 credits.
You need to go to settings and enable “Also create WebP versions of the images” in the Advanced section. This will automatically create WebP images after optimization is completed.
JPEG vs WordPress WebP Optimization Comparison
The above displays six random JPG images downloaded from the web. The table clearly states the potential size difference achieved compared with the JPEG compression method and directly converting the files to WebP. Converting to WebP produced an average 50% decrease in image size.
Conclusion and Plans for the Future
WebP is considered a modern image format that focuses on optimization and speed without deteriorating the quality of the image. You can expect results of ~25% reduction in file size vs comparative JPEG or PNG files.
Around 95% of Internet users already use a browser that supports WebP. With the release of WordPress 5.8+, WebP is supported out of the box now. So there’s no excuse you shouldn’t use it.
As for now, the media component team at WordPress.org is also exploring the option of having the WordPress Dashboard perform the image format conversion on uploaded images – using WebP as the default output format for sub-sized images. There are even eyes on even more modern formats like AVIF and JPEGXL that will both improve compression and further reduce the resources required for compression.
Let us know in the comments below how WebP affected the performance on your site and what plugin did you make use of to obtain the results.
Check out WebFlare Blog for more valuable content