How To Convert Images To WebP Format: Everything You Need To Know

Images are an essential part of making a website look great. However, when used ineffectively, images can slow down a website. Don’t worry though, as it is possible to optimize images to negate this potential decrease in PageSpeed. One of the best ways to optimize the images on a website is to convert them to WebP format. After reading through this article you’ll know everything on how to convert images to WebP format.

Converting images to WebP format is one of the easiest ways to optimize an image for PageSpeed. In this article I will detail what WebP format is and how exactly is helps speed up your website and reduce load times.

There are two methods I use for converting images to WebP format, and I will also be sharing both of those methods today!

Now let’s jump on in and discuss the benefits of converting images to WebP format, and breakdown exactly how to make it happen.

Content

Introduction To WebP Format

Converting Images to WebP Format

Did you know that you can cut down the file size of your images in half or even to a quarter of its original size? This can quickly add up each article, which adds up even further across the entire website.

This isn’t some magical paid service either, all you have to do is convert your images from JPEG or PNG into WebP format. I did this manually, but there are even WordPress plugins that can automatically do this process for you. Plugins like the Smush WordPress plugin can convert images to WebP format in bulk.

Converting an image to WebP format is just one way to compress an image, which is a big factor in image optimization. In this article I will be discussing specifically how to convert images to WebP format, and if you want to know everything about image optimization, I recommend you check out my full image optimization guide here.

Now let’s jump on in and discuss what it means to convert images to WebP format, and breakdown exactly how to make it happen.

What Is WebP Format?

WebP Format is a modern image format that provides lossless and lossy compression for images on the web. WebP images are about 25% smaller than their PNG and JPEG counterparts. This means that an image in WebP format will always have a smaller file size than the same image portrayed in any other format.

The WebP format was specifically designed to allow for faster loading times. This is because Google has increasingly taken more interest in investing in the speed of web browsing. Since WebP format was designed with speed in mind, PageSpeed is often increased on websites that convert their images to WebP format.

WebP images can be saved in lossless or lossy compression. Lossless compression is when you retain all information after compressing the image, and lossy compression entails losing some non-critical information in order to lower the file size further.

Since WebP was created with web speed in mind, I would highly recommend converting your images on your website with this format in order to maintain a fast and healthy website.

Why Convert Images To WebP Format?

There are many benefits to converting the images on your website to WebP format. Just converting an image to WebP format can cut down file size in half.

When you convert your images to WebP, amount of space across all pictures on your blog or website adds up fast! I am very happy with the ongoing PageSpeed results from using WebP images, and I highly recommend you do the same. 

As previously mentioned, WebP format was designed with speed in mind, so if you want a fast website with images that load quickly, you’ll want to convert your images to WebP format.

I know for a fact that this process is worthwhile, as I tested the PageSpeed of several articles before converting my images to WebP format, and the difference was significant for each individual page. I highly recommend utilizing WebP images here on out.

How To Convert Images To WebP Format

There are two methods I go about for converting the images on my websites to WebP format.

Method 1: Online Image Convert

Online Convert WebP

Online Convert is a free way to convert your saved image files into WebP format. While you can only convert up to three images at a time, this is a cost-effective way to convert images to WebP format as you need them. 

For instance, I use Online Convert to convert the images I will be needing for any given article. If I convert my images to WebP format as I need them, I will never be behind in optimizing the images on my website.

Let’s breakdown exactly how to convert images to WebP format using Online Convert.

How To Convert An Image To WebP Format Using Online Image Convert:
  1. Go to a image converting website (imagine.online-convert.com)
  2. Select a file to upload to the website
  3. Click “START” to begin converting images of choice (1-3 images)
  4. Wait for the conversion to process
  5. Right-click the “Download” button to the right of the image file name

The newly converted WebP image should now download and be saved on your device. You can convert up to three images at a time, and you can do this three times an hour without cost. This is why I use image.online-convert.com, as being able to convert up to nine images an hour is perfectly fine by me. It gets the job done that’s for sure.

I use this method when I just want to convert a few images to WebP format to use within a new article. If you want to convert your images for free, you will typically only be able to convert a few images at a time. This does get the job done however, and I haven’t been inconvenienced by these restrictions. 

If you don’t mind paying for a premium WordPress plugin that can convert all your images into WebP format in bulk however, this next method may be exactly what you’re looking for.

Method 2: WordPress Plugin

Smush WordPress Plugin

Smush is a fantastic plugin for image optimization in general. I highly recommend it for image compression and other great image optimization options. However, if you want to convert your images to WebP format, you’ll have to upgrade to the premium paid-version of Smush.

Considering having the images on a website being in WebP format is an important factor for increasing PageSpeed, it is totally worth it for converting images to WebP format in bulk.

Let’s breakdown exactly how to convert images to WebP format using the Smush WordPress Plugin.

How To Convert An Image To WebP Format Using Smush:
  1. Access the Wordpress toolbar
  2. Select “Plugins” on the Wordpress Sidebar
  3. Search for and select a image converting plugin (like Smush)
  4. Access the new image converting plugin from the Wordpress sidebar
  5. Configure the plugin to convert images across your website to WebP format

Now your images should be converted to WebP format across your website! Be aware that this can take some time. Once again, the mass-convert feature will only work if you have paid for the premium version of Smush.

Converting Images To WebP Format Notes:

Caution: Some images may experience a slight drop in quality. This has rarely been noticeable across my many blogs however, and the perks of using WebP images outweigh this slight con. Just be sure to use high-quality images and you should be perfectly fine!

*Note that some MacBook users are unable to see Webp images if they have not upgraded to Safari version 14. However iPhone users should be able to see your site’s images correctly.

Converting images to WebP format is a great way to save massive amounts of file space on images. Hopefully one of the above methods work well for your needs! Now I want to share some helpful tips for working with WebP images.

WebP Format Tips

  • Double check images for any drastic quality drops after converting them to WebP format
  • Utilize plugins and online converts to efficiently convert your images to WebP format
  • Ensure that images are viewable by all users (Example: MacBook users)
  • Convert ALL images to WebP format
  • Art websites may want leave their images in a higher-quality format

Web Image Tips

Unsplash

Need help finding images for your website? Here are some tips that can help you get some images on your site. Don’t forget to convert them to WebP format after!

Web Image Tips:
  • Use royalty-free image hosting sites like Unsplash.com to download images
  • Crop images to be 1200×600 for webpage images and 1280×675 for banner images
  • Avoid images that have excessively high file size
  • Convert all images to WebP format
  • Compress Images across to reduce non-critical or redundant information

More On Image Optimization

Converting images to WebP format isn’t the only way to optimize images for PageSpeed. Converting images to WebP format is just one way of compressing images and reducing file size. 

If you want to know more about image optimization and compressing images, I highly recommend you check out my full article on how to optimize images. In the article I share everything you need to know about image optimization, and I share all the tips & tricks in the book.

In the meantime, here is a roundup of all the image optimization tips you’ll need to keep your website running fast and efficiently.

Image Optimization Tips & Tricks:
 
  • Convert images to WebP format
  • Compress all images on your website
  • Use image compression plugins for WordPress
  • Keep images simple
  • Reduce the overall amount of images on each page
  • Do not use large images
  • Look out for decreases in quality when compressing images
  • Check that image formats are compatible for your readers

For more information on any and all of these tips, please check out my previously mentioned image optimization guide.

Other Ways To Increase PageSpeed

If you are interesting in converting images to WebP format and increasing load times, I would take a bet that you might be interested in some additional tips for increasing PageSpeed. Here is a list of other tips for increasing PageSpeed:

Factors that effect PageSpeed:

  • Use a fast web host
  • Pick a fast WordPress theme
  •  Cache Web Pages
  • Reduce unused JavaScript files
  • Reduce unused CSS files
  • Limit ad count
  • Reduce plugins

Each of these factors are an opportunity to increase the PageSpeed on your website. Do you want to know more about each of these PageSpeed tips?

Fortunately I have a full guide on how to increase PageSpeed, and I highly recommend you check it out! I go in to full detail over nine of the most essential tips for increasing PageSpeed across a website. This is a huge article, but it is worth adventuring through I promise.

Closing Thoughts

That’s everything you need to know on how to convert images to WebP format! I hope this guide was helpful, and I wish you the best of success in achieving optimal PageSpeed and site health. Don’t forget to check my website for other valuable image optimization tips!

Please feel free to reach out to me or comment down below if you have any questions or need any additional guidance. Also feel free to share your own thoughts on image formats as well! I always appreciate an opportunity to learn more. See you next time!