Table of Contents [TOC]
Table of Contents [TOC]
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 2022.
Other WordPress Plugin Lists you may find useful –
Plugins to Add Security Headers in WordPress
Why You Need a WordPress Image Compression Plugin?
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.
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.
Image File Formats – JPG, PNG
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.
What is a JPEG?
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.
What is a PNG?
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.
Optimise Images Using Photoshop
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 – Lossy vs Lossless Compression
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.
Choosing the Best Image Optimization Plugin in WordPress – Checklist
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:
- Optimization of the formats you want to use: png, pdf, jpg, jpeg, gif, and especially AVI and WebP.
We also insist on the PDF because sometimes the files are heavy like the IKEA catalogs available online for example:
- Compression function to lighten the weight of photos: process of encoding or converting an image file so that it automatically consumes less space than the original file (we saw the definition above)
- Automatically convert your images to WebP: WebP is a modern image format that offers superior lossy and lossless compression for images on the web. The plugin you choose must support and convert this optimized format widely used on the web.
- In the diagram below, we can observe that the WebP format systematically requires fewer bits per pixel than JPEG to obtain the same SSIM index (an index that measures the perceived quality of an image).
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.
Why is WebP the preferred format for images?
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
- WebP lossless images are 26% smaller in size compared to PNGs
- WebP lossless images are 25-34% smaller than JPEG images (Data Source)
“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.
Best Free Image Optimization Plugin WordPress
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 2022.
- Ewww Image Optimizer
- TinyPNG – JPEG, PNG & WebP image compression
- Kraken Image Optimizer
- Lazy loading
- PB SEO Friendly Images
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.
- Images are automatically compressed and scaled to fit the page
- Lazyloading is possible
- Images can be converted to WebP format (Google’s next-generation format)
- Possible resizing of existing images
- Added missing dimensions (width/height attributes to reduce layout shifts and improve user experience).
- Optimize everything on your site, not just the WordPress media library.
- Compression available for JPG, PNG and PDF files (useful for downloadable product sheets or online catalogs which can be quite heavy)
- Unlimited size of files you can import, so you don’t have to worry about large, uncompressed images.
- Bulk processing option available: optimize all your images from a single page
- When you install the plugin, it asks you what your goals are. For our comparison, we’ll stick to the free mode.
- The interface isn’t very user-friendly, but it still gets the job done, and there are almost no settings to apply before using it.
- Price (depending on the features you have access to)
- Ewww image optimizer is free to use, but if you need to optimize your site even further, you can choose the premium plan. It includes JS and CSS optimization, caching options, CDN, more bandwidth and better optimization capability.
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.
- Supported formats: PNG, JPG, GIF, BMP and TIFF images (free up to 5MB)
- Bulk operation to optimize all your photos in 2 clicks
- Interface that goes straight to the point:
- “Optimize on download” function available
- Important: conversion to WebP and optimization of WebP images is not yet available but it should be soon
- The price: the plugin is free. Indeed, the only restriction is to send images of less than 5 MB.
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.
- Support for PNG, JPG, GIF, PDF and WebP
- Ability to convert images to WebP format and also display them in WebP format on your WordPress site in two ways: using the <picture> tag or in the .htaccess file.
- Resizing and optimization can be done automatically when uploading or during the optimization process of existing images.
- There are three different levels of compression:
- Normal – lossless (compression without loss of quality)
- Aggressive – lossy (compression with a slight loss of quality)
- Ultra – lossy (compression with slightly greater loss of quality) but for maximum file size savings.
There is also a very practical tool to compare the quality of images before and after optimization:
- Support in English because the team behind Imagify is English(WP Media) and they also developed the famous cache and performance plugin: WP Rocket.
- Automatically resize images to a certain maximum dimension.
- Imagify uses its own servers to optimize your photos (which consumes less bandwidth and preserves the loading time of your pages)
- Backing up original images (to restore images after compression)
Mass optimizer to optimize media library with one click:
- Price (depending on the number of images you want to optimize)
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!
- Supports the following image types: jpg, png and SVG format
- Clear and very user-friendly interface
- Algorithms with and almost without loss of quality for compression, there are also 4 types of compression levels: Auto, High, Medium, Low. Note that higher compression may cause a slight loss of image quality, but this is almost invisible to the naked eye.
- By selecting the automatic level, Optimole will find the right balance and choose the minimum size without losing quality.
- You also have a tool to compare the quality of images before and after optimization:
- WebP image support
- Serves images from a global CDN (free!)
- Responsive options: Optimization according to the device used by the visitor.
- Smart Cropping: Keep the most interesting part of an image without compromising quality.
- Pricing (depending on the number of visits)
- With the free plan, you can optimize an unlimited number of images for up to 5,000 visits per month.
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.
- Image compression with and without loss of quality is available in the following formats: JPG, PNG, GIF, WebP, AVIF and PDF files.
- New images are automatically resized and optimized
- An interface with more advanced options is available
- Compatible with any gallery or e-commerce plugin.
- Automatic downscaling of large images
- Ability to automatically convert PNG to JPG for smaller images
- Optimize all images on your site
- Conversion from CMYK to RGB
- Pricing (based on the number of images you need to optimize)
- The plugin itself is free and comes with 100 free credits/month. Additional credits can be purchased starting at $4.99 for 7,000 image credits.
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.
- Option to bulk optimize your existing JPEG and PNG images, all at once
- Two types of formats are supported: PNG, JPEG
- Converting from CMYK to RGB to save additional space
- Optimization of individual images that are already in your media library and also bulk optimization of your existing media library
- Automatic optimization of new images when you upload them to your WordPress site
- Progressive JPEG encoding: View JPEG images faster.
- Compress animated PNGs
- Select WordPress Thumbnail Sizes That Can Be Optimized
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.
- This plugin offers you a free version and a paid version. The free version can be downloaded from the WordPress repository. The paid version actually comes bundled with a set of tools (including WP Smush). The paid version costs $49 per month.
- In the free version of WP Smush, you can only optimize your site images with lossless compression (if you want lossy compression, you’ll need to upgrade to the premium version). You also have the “lazy load” option, as well as the possibility of optimizing up to 50 images at the same time. You’ll also be able to resize images (set maximum width and height settings) and quickly spot images that are slowing down your site.
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.
- API handles millions of requests per day without a hitch
- Just send your images to us, we’ll do the work. It’s that simple.
- optimize them, and give you back a ZIP archive. If you like, you can have the images placed into a folder structure matching that of each image URL
- Many images are larger, in terms of dimensions, than they need to be for a given use-case or purpose
- Upload a ZIP archive by dragging it into our Web Interface. Kraken.io will decompress it, optimize all images found within the archive and notify you once the job has been completed
- It gives you the freedom to change your CDN provider
- Just click on one of the many “Contact Support” buttons found on our site and start typing away
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.
- Allows configuration of max width/height and JPG quality
- Bulk resize feature to resize existing images
- Automatically scales large image uploads to a more “sane” size
- Selectively resize images directly in the Media Library (List View)
- Optionally converts BMP and PNG files to JPG for more savings
- Once enabled, Imsanity requires no actions on the part of the user
- Uses WordPress built-in image scaling functions
10. Lazy Load
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.
- When we lazy load images and video, we reduce the initial page load time, initial page weight, and system resource usage, all of which have positive impacts on performance
- LazyLoad for background images is automatically disabled when the Bridge theme is used
- LazyLoad is applied on the template_redirect hook
- LazyLoad process the HTML in PHP, using a regex to detect images and rewrite the img src(s) with the placeholder
- LazyLoad replace the image src with this placeholder
- By default the threshold is 300, i.e. images within 300 pixels of the viewport will be Lazyloaded.
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.
- Override: You can override existing »alt« and »title« attributes with a custom scheme
- Scheme: Set up a scheme for your »alt« and »title« to flexible define and optimize your content
- Sync: You can sync existing »alt« to »title« and vice versa
- For all images: The plugin works great with images in posts and posts thumbnails as well
- WooCommerce support: User WooCommerce product title as image alt/title (pro feature)
- SEO Proved: Default settings of the plugins are proved by an SEO consultant
Test Results For Best WordPress Image Optimisation Plugin
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.
- My image without optimization:
- Original image size: 518 KB
- Page weight: 980 KB
- Image size: 196 KB
- % of total page weight occupied by images: 20%
- Result of the test after optimization on my image in JPEG
- Image size after optimization ( 518 KB without optimization)
- Page weight after optimization (980 KB without optimization)
- Weight of images in the page (196 KB without optimization)
|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.