Want to know How To Optimize Your Images For WordPress? Looking for the best WordPress image compression plugin? This is a great move to improve the performance and speed of your website.
WordPress automatically creates at least three versions of each image you upload to the media library, so you don’t have to do any manual resizing. Unfortunately, it doesn’t do much else to optimize them (except for stripping out metadata).
To help ensure your images are properly optimized and don’t slow down your site, you can use a WordPress image optimizer plugin instead.
There are multiple WordPress image optimization plugins on the market. After carefully testing all the image optimization plugins for wordpress in 2021, we have listed down the most popular options in 2024.
Other WordPress Plugin Lists you may find useful –
Plugins to Add Security Headers in WordPress
Plugins to Prevent WordPress CSRF Attack
Best WordPress Staging Plugins To Create A Test Site
WordPress Passwordless Authentication Login Form Plugins
Best WordPress Security Plugins To Secure Your Site
Plugins to Block Countries In WordPress Using IP Address
Best WordPress Security Scanner Tools To Scan For Vulnerabilities
Images can improve the experience on your site, elevate your brand, and provide additional assets to use in promotion. However, unnecessarily large images can increase page load speeds, which negatively impacts your SEO and causes frustration for your visitors.
You can mitigate these issues and enjoy all the benefits images have to offer by optimizing your images.
WordPress image optimization is part of a larger process of employing speed-enhancing strategies to improve user experience and ranking on search engines (read more here). If you want to speed up your website, look into compressing CSS and JavaScript files and using a caching plugins. Check out our post on – 26 Best WordPress Speed Optimization Plugins 2024
For this post, we’ll focus on how to optimize images in WordPress. We’ll start by explaining why image optimisation is an essential aspect of overall wordpress speed optimisation and how to reduce the file size of your images using image compressor plugins. We’ll discuss how to serve scaled images in WordPress so that no matter the device or screen size, your images are always appropriately sized for display.
You should always optimize your images because otherwise, they could be responsible for the slow loading of your pages. According to Google, for every second of delay on mobile, conversions can drop by up to 20%!
By optimizing your images, you will have a faster site, which will increase the number of page views and therefore your conversions. Cloudflare summarizes very well the correlation between loading speed and conversion rate:
And did you know that images make up an average of 21% of a web page’s total weight?
Images are the first thing visitors see on your site, and they contribute to your brand’s visual identity. Therefore, you have to find the right balance between optimization (compression) and quality.
The two most common image formats used online are JPEGs and PNGs. Both of these formats are made up of pixels. Pixels stretch when you change the size of an image, which can sometimes make it blurry. However, these image types have different strengths and weaknesses.
Before optimizing any images for your website, you should first understand how each format works.
JPEGs are best for images with lots of colors, such as photographs. These files use the extension .jpg or .jpeg in the file name. JPEGs work by compressing the image and discarding extra information about its color to lower the file size.
Animated GIFs, too, can be useful if you want to add movement to your page without using a video file or embedding content from another video site.
PNGs preserve the original quality of their images, so they don’t lose quality when enlarged or compressed. This makes them a good choice for text and logos that need to be sharp and clear no matter what size they are displayed in. They also support alpha transparency so they can be overlaid on top of other images or backgrounds without obscuring them with a rectangular border.
You can use Photoshop, Lightroom, or a similar editor to reduce the image size to around 1,500 pixels or less in width. In Photoshop, simply go to Image > Image Size to manually adjust the dimensions and resolution of your image. You can also go to File > Export > Save for Web to optimize your images for web upload :
If working with Lightroom, go to File > Export to manually adjust the image size upon exporting it:
Image compression isn’t just important for your website; it’s essential. To understand why, you first need to know how the process works.
In a nutshell, image compression is a way of minimizing the size (in bytes) of a graphic file, without degrading the quality of the image to an unacceptable level. As we’ve discussed, high-resolution images that are unnecessarily large in file size can dramatically affect page speed.
This is because large images take longer to load on a user’s screen than smaller ones. When people visit your website, their browser has to retrieve each image from wherever it’s stored on your site and then render it on screen. Large images take longer to download and display than small ones, which slows down page loading times. In turn, this can lead to frustrated visitors leaving your website midway through loading and going elsewhere instead.
Compressing large images for web use is therefore crucial for optimizing your site for speed. It significantly reduces the amount of data that needs to be downloaded before each of your pages can be viewed, which ultimately improves its loading times (as well as giving you more wiggle room in terms of file size limits).
There are two main types of image compression, Lossy vs Lossless Compression
Whether you’re using WordPress or Squarespace, the speed of your site is critical. Every second counts when it comes to loading pages, and the more site traffic you can get the faster your site will load.
Image optimization is an important way to speed up a website without sacrificing quality. There are two main types of image compression: lossless and lossy.
lossless compression is commonly referred to as ‘uncompressed,’ while lossy compression is commonly referred to as ‘lossy.’It preserves all of the data from the original file, without sacrificing quality.
Lossless compression uses algorithms that preserve all of the information in the original file. In other words, it doesn’t remove any data from the image file.
On the other hand, lossy compression reduces the size of an image by removing some of its data. This can result in a larger drop in quality, but also a more significant improvement in page speeds. You can even customize the amount of compression, in order to achieve a balance between quality and performance.
In this section, we’ll show you some of the key features you should look into before making a purchase.
Make sure your plugin of choice has the following features:
We also insist on the PDF because sometimes the files are heavy like the IKEA catalogs available online for example:
NOTE – while this article only focuses on optimizing standard image files such as JPGs and PNGs, you can also use vector graphics in WordPress, such as SVG files. The technique I’ll be showing you uses lossy compression to reduce file size without impacting quality. This works well for traditional image files but not vector graphics because it permanently removes some data from the file.
WebP is an image file format that Google has developed as a replacement for JPEG, PNG, and GIF file formats. WebP yields files that are smaller for the same quality, or of higher quality for the same size. It supports both lossy and lossless compression
“Lazy Load” option displays images only when visitors see them, saving bandwidth.
Choose whether you want your image to be optimized using the lossy and lossless compression algorithm. Then, make sure the plugin has both options according to your needs.
A CDN option that automatically compresses and converts images as they are viewed by your visitors.
An option that allows you to optimize the images already uploaded to your website, to save time with the images already in place in your layouts.
Bulk Optimization vs. Individual Optimization: Both options are very useful, as you can optimize your existing media library in bulk (one click) or manually select which images to optimize.
For example, maybe you want to optimize your 2000 WooCommerce product images but not your main banner. These settings are important.
A save and rewind option if you need to go back to the original images.
Now that we’ve seen some of the best features to look for in a plugin to optimize your images, let’s take a closer look at 11 WordPress plugins that let you give your website a boost.
Images on a site can have a noticeable impact on the overall loading speed of the site; We have listed the top image optimization plugins that you can use to optimize your site.
Here are the top 11 image compression plugins to speed up wordpress site in 2024.
Over 900,000 websites use the Ewww Image Optimizer plugin to speed up their images, without losing quality.
It automatically optimizes images as you download them and you also have the option to optimize previously downloaded images individually or in bulk with lossy and lossless compression.
The reSmush.it image optimizer allows you to optimize your images for free and you can also change the optimization level of your images and exclude certain images from the optimization process if you wish.
reSmush.it has over 200,000 active installs with a 4.5 rating on WordPress. Description reSmush.it Image Optimizer allows using free image optimization based on reSmush.it API.
This plugin allows automatic image optimization right after activation, and it only includes a handful of settings. reSmush.it provides FREE image optimization, for the most common file types (PNG, JPG, GIF, BMP and TIF). It allows reductions up to 80% using different algorithms.
With over 500,000 active installs, Imagify is one of the most advanced plugins for optimizing your images right in your WordPress dashboard.
With a modern interface, Imagify optimizes your media storage because it compresses both the images already present in the WordPress library and the future ones that you will upload.
There is also a very practical tool to compare the quality of images before and after optimization:
Mass optimizer to optimize media library with one click:
The free API key will allow you to resize and compress 20MB of images per month (about 200 images). You can then pay $4.99 per month for 500GB (about 5000 images) or $9.99 per month for unlimited usage.
The Optimole image optimization plugin offers a pretty clean interface and image optimization just requires creating an account and then inserting your API key.
Once this is done, you will be able to view all the optimized images in the dashboard and modify certain parameters: the resizing of large images, lazy loading or even the quality of the compression. Monthly reports are also included!
With over 300,000 active installs, the freemium image optimization plugin ShortPixel offers three different image compression algorithms: lossless, lossy, and glossy, so you can choose what works best for your project.
This plugin allows you to optimize JPEG and PNG formats. It is based on the famous image compression services of TinyJPG and TinyPNG.
Both of these tools analyze the content of an image to choose the best compression strategy for each photo without compromising quality.
Note on the premium version
On WordPress, you can optimize a hundred images each month for free. When you upgrade to the pro level ($25/user/year), you’ll have access to drag-and-drop for more than 20 images at a time, you can increase your file size limit from 5 MB to 75 MB, and have access to statistics using the Analyzer tool.
Smush Pro is a leading WordPress plugin to optimize images on your site and make your site much faster than before.
The plugin comes with a bulk image optimization option that will help you optimize all the images already on your site with just one click. And all new images will be optimized as they are uploaded to the site.
The Smush plugin offers a completely free version that you can install directly from your WordPress dashboard. The free version of the plugin has over 1 million active installs and growing.
If you check the Google Page Speed score, you will find an error about serving the images in the next generation format. Now, Google is asking websites not to use the usual image formats like PNG, JPEG, but instead use the next generation format.
Smush Pro plugin supports WebP image version which is much lighter than other image formats like PNG, JPEG. Also, since PNG files are larger, the plugin can convert all PNG files to JPEG automatically.
Another advantage of using the Smush Pro plugin is the CDN option which gets you in handy. All your images will be served through 45 different locations with WPMU’s ultra-fast CDN to improve the overall performance of your site.
You will have the option to back up the original images in case you need them and restore the original images at any time.
The Smush Pro plugin gives you a one-click solution to resize and scale images so that the images fit inside the container correctly (recommended by Google).
The Smush Pro is by far the most popular image optimization and compression plugin for WordPress, with over a million active installs today. It is an easy-to-use plugin made by the WPMU DEV developer team to quickly optimize your WordPress site images.
It is of course compatible with WordPress in its multisite version.
The Smush is used for WordPress image optimization plugins when compressing your images individually via the WordPress media manager or when compressing images in bulk via the Bulk Smush submenu item under “Media”.
This plugin works by stripping metadata from JPEG files, optimizing JPEG compression, and converting certain GIFs to PNGs.
The Kraken Image Optimizer WordPress plugin is another image optimization plugin that can help you compress JPG, PNG, and GIF files using its API. Just like ShortPixel, here too you will have to register a free account with them on kraken.io.
The plugin offers a wide range of options. For example, you can toggle between a smart lossy compression profile or enable a lossless option.
There is an option to specify values for JPG images. You also have the flexibility to set a maximum resolution for your images. There is also another useful feature that helps you choose which image attributes you want to keep.
Imsanity is a WordPress image optimization plugin that can resize your incredibly large image files into sensible and ideal proportions. The plugin is very light, has no unnecessary features, and is free to use.
However, these are useful features that allow you to set a maximum limit on width, height, and quality. This can be useful as now you won’t have to manually resize at load time and prevent your page from breaking.
There is also the option to convert BMP files to JPG. This improves the scalability of the image.
Here we are discussing a solution that improves your website load times, which can be hampered due to large images! One of the solutions is to compress the images. Another is Lazy Load.
As its name suggests, the Lazy Load WordPress plugin offers a lazy loading functionality to improve the loading time of your site. To use the plugin, no configuration is required; everything works immediately.
SEO Friendly Images WordPress plugin is used to optimize your images for SEO and does not help with image compression.
Making your images SEO-friendly is also part of image optimization which is very important and can help you improve your search engine rankings.
The plugin helps you set the proper ALT and TITLE attributes for images that allow you to increase your SEO score.
Web crawlers used by search engines can’t see your images, so they use the ALT and TITLE attributes to guess what the images are about. So you can see the importance of having this.
To test our plugins, we performed a test using an image in JPEG and lossy compression (slight loss of quality).
The tool used: GTmetrix and more precisely the “Page Details” tab which gives us access to two crucial information: the size of the page and the weight (in KB and in %) occupied by the images
Here is our JPEG image file, the original file size is 518 KB:
Let’s see which WordPress image optimization plugin performs best. In any case, the gain in terms of performance on our image is clear, both from the point of view of speed and with regard to the weight of the page.
PLUGIN | ORIGINAL SIZE | SIZE AFTER OPTIMIZATION | OPTIMIZATION PERCENTAGE | TYPE OF COMPRESSION |
ShortPixel | 518 KB | 169 KB | 67.36% | Lossy |
TinyPNG | 518 KB | 248.6 KB | 52% | Lossy |
Optimole | 518 KB | 274 KB | 47% | Lossy and Lossless |
Imagify | 518 KB | 338.7 KB | 34.64% | Lossy |
EWWW | 518 KB | 488.9 KB | 5.70% | Lossless |
In the first place, we have EWWW with a saving of 58%, closely followed by Imagify (57%) and Shortpixel (56%).
If you’re looking for a way to speed up your website while maintaining quality images, it might be worth investing in an image optimization plugin.
The plugins we reviewed can help reduce the size of images on your site and improve loading speed by reducing your page weight. What plugin are you using? Feel free to add to this list.