The speed of your website is an important factor to take into consideration. Speed and security.
The slower your website is, the more frustration you’re causing your site visitors. Your website speed is also something search engines take into account.
A huge factor contributing to the speed or slowness of your website is the size of your images. Most people know that compression is a huge benefit for website speed. It will provide one of the biggest speed increases.Never stop optimizing your website. Let's integrate the WebP image format type into #WordPress. Click To Tweet
There are some great tools you can use compress your images depending on your setup and preference.
- A standalone Mac or Windows app like ImageOptim
- WordPress plugins like EWWW Image Optimizer
- Photoshop plugins like TinyPNG
- or Sketch plugins like Image Compressor
Step Beyond Normal Image Compression with WebP
WebP is a modern image format introduced by Google. It provides superior lossless and lossy compression for most of your images. This means that your images are smaller in file size, your site will load faster, and your server load will decrease.
The awesome thing about WebP is that you can make sure that only the image with the smallest file size loads. For instance, you might have a PNG and WebP of the same image, but only the one with the smallest file size will load!
Super sweet. Super fast.
WebP Images With WordPress
There are two plugins you have to install to make WebP images work with your WordPress website. They are both free and easy to setup.
The first one is either of two of my favorite image optimizers. They are both great options.
ShortPixel Image Optimizer
This plugin compresses all files with your Media Library and any additional folders you tell it to check. It compresses images better than any plugin I have tried and has a great set of basic and advanced options, including WebP conversion. ShortPixel Image Optimizer does require an API key, so you’ll have to create an account, as it’s a Freemium product.
EWWW Image Optimizer
Not only does this plugin optimize all the images within your Media Library, it can also optimize images of your themes. Also, it’s free.
This plugin also converts and compresses images to the WebP format. Don’t worry about the rewrite rules that are on this page. They aren’t needed. We will be enabling WebP images in browsers that support it with a better solution.
Now install the Cache Enabler plugin. Make sure you check the Create an additional cached version for WebP image support option. I leave all other options unchecked and disabled because I use better speed and optimization techniques.
Make Sure WebP Images Are Being Served
After you install the two plugins, make sure you go to
Media Libary > Bulk Optimize in WordPress. This will optimize all images in your WordPress website.
If you have some sort of WordPress cache, clear it. Note that you will not be served WebP images when you’re logged in to your WordPress website. Open a separate Incognito Tab or a logout.
All you have to do is go to the Developer Tools in your favorite browser. Here, click on Network and refresh your page. I like to click on the IMG filter so I see images only. In the Type column, you should see some images that are labeled WebP. These are the ones smaller than the JPG or PNG version.
The kilobytes that will be shaved off of each image will add up to quite a bit depending on how many images you have on your pages.
WordPress Speed and Optimization
I wrote an in-depth blog post with numerous code snippets and information with WordPress speed optimizations that you can do right now. They’ll make your website faster and more user friendly, hopefully ranking better as well.