Contents
Why optimize WordPress images?
If you want to rank well in Google search results then you absolutely do need to optimize your images.
In this article we’ll pick the two best free apps to optimize WordPress images.
When we say “optimize wordpress images” we mean reducing the file size of the image so that it downloads faster. Let’s face it, pages without images generally aren’t very engaging and although a plain text page may load in a millisecond, the reader will decide to leave in a millisecond because there’s no immediate appeal to grab their attention.
We want images, often a large number to tell a story on a travel blog or a food blog or a news site, and that can mean several megabytes or even tens of megabytes of data to download.
It may load really quickly for you on your fast home broadband, but not for the person on a 3G mobile connection. Pagespeed checkers like Pingdom will tell you this is bad, and more importantly Google now considers page loading time as a factor when ranking pages.
There are other important things you have to do to optimize your WordPress images for better page loading speed, such as using CDNs, setting cache control headers, and responsive design for tablets and mobile. We’ll cover all of these techniques in other articles here on CodeThump.
In this article we’re going to select the best, simplest, fastest, cheapest (or free) ways to optimize your images for WordPress.
Easy ways to optimize images for WordPress
Before you start choosing WordPress image optimization tools, there are some basics that you should already be doing when adding images to WordPress that will help your SEO efforts.
Use titles and alt tags
When you upload an image to wordpress, give it a meaningful and descriptive title and alt tag. You can simply copy the title and use it as the alt tag. Without an alt tag, and with a title such as “image202001010930.jpg”, your image will never show up in Google images search results.
An image with a title and alt tag that describes the image, eg “the Taj Mahal at sunrise in the mist” will at least stand a chance of showing up in Google. When all the images in your page have descriptive titles and alt tags, it boosts the SEO score for your page.
Scale images
You can upload a 4k image at 3840 x 2160 pixels, but you aren’t going to need that sort of resolution in your pages. A very simple way to cut down the size of the images you’re storing in your WordPress is to simply scale the image. Set the with to 1920 pixels and scale it. WordPress will set the height to match and keep the same ratio. 1920 is a 1080p image and is plenty big enough for full screen display. Scaling down like this reduces the file size a long way.
Crop images
When you upload an image that isn’t already perfectly composed for your needs, crop it. Choose edit image and click crop. I like to lock the aspect ratio of the cropping area to 16×9 so that all my images are the same dimensions and then it’s easy to make things line up properly. When you type 16×9 into the aspect ration box it may not allow it, and one of the numbers will remain blank.
This is because it tries to dynamically resize the crop area and it fails if it would go outside the current image. To get past this, drag the corner of the cropping tool and shrink it so there’s plenty of space, then enter 16×9 again.
With the aspect ratio locked, you can now crop the image to cut out empty backgrounds and tighten the focus on the part you’re really trying to show. Remember to think about composition and the rule of thirds and adjust your image to something that is balanced and draws the eye to the right area.
Problems with optimizer plugins
Most articles about optimizing images for WordPress will run through the same set of plugins and tell you to use one that has low limits on the number of images you can process for free and costs a lot to buy.
The bigger issue I have with those plugins is that nearly all of them try to do other things that just gets in the way. I want to optimize images, and I want one way of doing it that works really well, but I don’t want a plugin that also wants to optimize my static assets or offload my images to a CDN or do the image optimization on a remote server, because I’ve done all that with other plugins and in my WordPress setup anyway. PS, we’ll be bringing you tutorials about how to optimize static assets and how to setup your CDN with high performance and low-cost using AWS.
I certainly don’t want a plugin that pesters me to leave feedback or purchase an upgrade every time I use it.
No, I prefer to use desktop software. It’s cleaner, easier, faster, gives me more control and doesn’t clutter up my WordPress with more plugins that bundle up loads of features I don’t want.
Candidates
The first candidate is Optimage. This app is free for 24 images a day, which will be fine if you’re doing one or two posts per day. If you want unlimited image processing then it’s just $15 to buy the app, and that’s a one-off purchase that will last forever.
Optimage is very easy to use. Drag and drop a batch of images onto the app and it automatically shrinks them, in seconds. In the preferences you can choose where to save them – I prefer to keep them in the same directory and just add a suffix to the filename so I still have the original – and you can also automatically scale the image to a maximum size, which means you’ll never waste time uploading anything to your WordPress that is bigger than you will actually use.
The second candidate is ImageOptim.
ImageOptim looks and behaves quite similar to Optimage. ImageOptim has a very important advantage over Optimage. It’s free for unlimited use.
However it has some disadvantages. You can’t change where it saves files – it will replace the original file. This means that if you want to keep the original, you have to remember to make a copy first. It also doesn’t have the ability to scale images to a preset size first. Finally, there are more complex settings available to control the image quality and the amount of compression – this may be useful or just extra work depending on your point of view.
Test images
We’ll run this test on a few sample images, and here they are:
These images are 2.1MB, 1.1MB, and 1.9MB respectively. I’ve deliberately included an image with a large plain area because surely there can’t be much saving to be had on a image with so little detail? Right?
Optimize WordPress images – Results
Column one shows ImageOptim with the default compression settings but lossy compression enabled.
Column two shows Optimage with the default settings. Columns 3 and 4 show the size after scaling to a maximum width of 1920, just to illustrate how much more can be saved by scaling your images before you ever bother uploading to WordPress. Unless you want to allow users to download really high res images, you can save a lot by scaling them down first.
ImageOptim | Optimage | ImageOptim 1920 wide | Optimage 1920 wide | |
Image 1 reduced | 1.7MB | 1.85MB | 292KB | 563KB |
Image 1 saving | 18% | 11% | 86% | 73% |
Image 2 reduced | 380KB | 1.05MB | 89KB | 186KB |
Image 2 saving | 65% | 3% | 92% | 83% |
Image 3 reduced | 848KB | 1.78MB | 182KB | 291KB |
Image 3 saving | 56% | 7% | 90% | 85% |
The best way to optimize WordPress images
Look at the percentage savings in column 1 versus column 2 and it’s clear that ImageOptim is the winner. Looking at the optimized images, I couldn’t tell the difference in image quality by eye.
ImageOptim is also free. It’s a shame that it overwrites the original image, but if you get into the habit of making a copy first, it’s fine.
The other downside of ImageOptim is that you will need to scale the images. You could do this on each image when you upload to WordPress, but it would be better to do it in a batch before uploading.
On a mac:
- select all the images you want to resize
- right click and open with Preview
- In Preview, from the edit menu choose Select all
- From the tools menu choose Adjust size
- Enter 1920 pixels for the width
- Ensure Scale proportionally is checked, then click OK
Look at the results when you optimize with ImageOptim and then scale to 1920. A file size reduction better than 80%.
For free.
Best free WordPress image optimizer – ImageOptim
ImageOptim is our winner for the best way to optimize WordPress images, both in performance and cost. The downside is that optimizing and scaling requires two separate operations, whereas Optimage does it in one. It’s easy to do both these operations on a batch of images, so it’s not a big price to pay for a completely free way to optimize any number of images without limits and without being pestered to buy premium WordPress image optimizer plugins.