How to Optimize images for WordPress

Summary

This article will explain, why, and hot to optimize your images for WordPress websites. I personally recommend doing it before you upload the images, but there are some useful plugins, if you already uploaded your images.

Why optimize images

Speed is the name of the game. Sitting down for five minutes and waiting for the images to load is just not they way you want to go. And yes, most people do have fast internet nowadays, but not always. Especially on mobile networks, the speeds don’t have to be that fast, plus, if people find out that your website just took 100MB of their data, they might get angry with you.

Ecological issues are also to be considered, bigger size means more electricity…

WordPress does it for me

Yes and no, WordPress does create smaller versions of images, when uploaded, these are usually called thumbnail, medium and large. And yes, you can use those, depending on your theme, they might be used for featured images of your blog-posts or any other way. But, WordPress doesn’t change the image format, so, if you upload a PNG, it will stay a PNG.

Compression – WebP is the best

The best format is WebP, WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Basically, this format was created to be used for images on the web. There is another format like that, called AVIF, but unfortunately not all browsers support that, so that is not an option.

JPG is also fine, in the end, it’s all about the size. You can get better quality with same size from WebP, but if you don’t want to bother with WebP, JPG is fine.

PNG is not fine. PNGs are too large and are not good for websites. If you need an alpha, meaning you need your image to have some parts that are transparent and show what’s behind it, WebP supports alpha too.

All the Minimalio Demos are using WebP and none of the images is bigger than 150KB.

Size in px: ~2000px max

It very depends on how and where you use the image. If it’s a massive image all over your website, I would say 2000px is well enough. But you might test it. Retina displays might also be of consideration. Nevertheless, if you have three images on a page next to each other, 1000px width should be well enough.

Size in KB: ~500KB max

Again, depends on where, but generally, I would say that 500KB is the absolute maximum, anything after that is just unnecessary and nobody will see the difference.

How to optimize

There are two options. I personally think, that it’s much better to optimize your images before you upload them, that way, you don’t have to use any plugins, third-party services or anything.

Optimize before you upload

There are thousands of free online tools and thousands of apps that you can use. There are also 5 new ones every week, so, it’s impossible to keep track of, and know which one is the best deal right now.

I have experience with this free online tool – https://squoosh.app/ And it’s fantastic, the issue is, that you can only do one image at a time.

For that reason, I bought an app from App Store, there are certainly same apps for purchase, maybe even free ones for PC. And this app saves me so much time, that I would recommend it to everyone. It’s called Image Tool + and I highly recommend it.

Optimize after you uploaded

To optimize images that you already have in your WordPress, you have to use a plugin. Again, so many options, it’s hard to keep track of. I have used a plugin Imsanity, for quite some time, and it’s reliable and does what it says it will do, for free. Recently, I have tested CompressX and it also seems to be working well.

Imsanity Plugin

It will automatically resize your images after you upload them, and you can also use it to bulk resize the images that you already have there. It can also turn PNG into JPG, but unfortunately only for newly uploaded images, so you can’t make JPG out of PNG for images that you already have on your website.

https://wordpress.org/plugins/imsanity/

CompressX

I have recently tested this plugin, and it seems to me that it works, but recommending plugins is a very tricky thing and I don’t want to be responsible. I have nothing to do with this plugin, so, please be careful. But, it does bulk resize all the image to WebP for free and that is amazing.

https://wordpress.org/plugins/compressx