Image Optimization In WordPress: Beginner Guide And Plugins Review
Last Updated: January 18, 2021 in Optimization
We all know the fact that WordPress is lesser known for speed. One should put some efforts to boost the performance of a WordPress site. There are a number of ways to do so, one of them is to optimize images in WordPress.
According to a research, you have only 7 seconds to grab the attention of a visitor. If got, there is a chance that he will be the recurring visitor. If not, he might not visit a site again EVER!
Today, I’m going to let you know the benefits of image optimization and guide how one can speed up a WordPress site just by optimizing images.
Advantages of Image Optimization
- Consume less bandwidth and storage space
- Reduces page size
- Faster loading times
- Boost SEO because of the fast loading pages
- Saves mobile data plan for you and your visitors
Use Correct File Format for Images
Before we start, we need to understand the image file formats properly so that one should know which file type to be used for a particular image. There are three image file formats used widely.
- JPG: JPG or JPEG images are used for realistic images and photographs.
- PNG: PNG images come in handy for line-art, text-heavy images, and images with few colors.
- GIF: GIF is a good choice for storing line drawings, text, and iconic graphics.
Optimize Image Before Uploading
Let’s start from the very initial step that is creating images. It is always recommended to optimize images before uploading it to a WordPress site. You can use tools like Photoshop. If you are not familiar with Photoshop, you can use a desktop tool RIOT, that will reduce the image size or any online tool like TinyPNG, Kraken, Optimizilla, and Compressor.
From our experience, Optimizilla works best in both terms of quality and file size. It produces the best optimization, outputs minimum file sizes. The only disadvantage of Optimizilla is it has only lossy compression.
Kraken and Compressor have similar output. Both of them offers lossy and lossless compression. The output file size is not as good as Optimizilla, but still good.
TinyPNG maybe the worst in the list as it produces larger file sizes.
Optimize Images on WordPress
WordPress powers more than 33% of the web. Thanks to its contributors and developers to provide a solution for almost every requirement. There are a number of image optimization plugins available on the Internet. In today’s article, I’m going to compare 3 different free image optimization plugins for WordPress.
- WP Smush
- EWWW Image Optimizer
- TP Image Optimizer
- ShortPixel
WP Smush
WP Smush is one of the products developed by the team at WPMU Dev. It is an award-winning plugin beating the other top image optimization plugins. Previously, it was part of their yearly subscription but a few weeks ago, they made it completely free for WordPress users.
With WP Smush you can easily resize, compress, and optimize images regardless of which WordPress media library folder they exist. It scans every image you upload, or you have already have uploaded images to your site. It has the power of removing unnecessary data and scales it before adding it to the media library.
While everything seems to be perfect, there are 2 things that we don't like from WP Smush:
- The free version allows to optimize images under 1MB. While it's fine in most situation, it won't be useful if you need to optimize high-quality images.
- There are no options for selecting lossless or lossy compression. So, we assume it only allows lossy compression.
EWWW Image Optimizer
EWWW is one of the leading image optimizer plugins within the WordPress repository. It will automatically optimize new images that you upload and it can also optimize previously uploaded images. Not only this, EWWW allows you to convert images to the best file format optionally.
EWWW is totally free. But it provides only lossless compression for JPGs (for PNGs, it offers both lossless and lossy compression). To be able to use lossy compression for JPGs, you need to register a paid plan on their website.
In this test, we just use the free plugin with lossless compression.
TP Image Optimizer
Let’s not leave the newest plugins in the market. TP Image Optimizer is one of the growing image optimization plugins. It is the product of folks at ThemesPond. Just like other plugins, it also optimizes, compresses, and reduces the image size.
TP Image Optimizer has a nice dashboard. While it's very beautiful (with a graph to show you the statistics), we don't think it benefits users much.
One disadvantage of the plugin is it doesn't automatically optimize images when uploading. You need to go to the dashboard and press the "One click optimize" button.
TP Image Optimizer doesn't say clearly on its settings page which type of compression it uses (lossless or lossy). But it provides some levels: low, medium, high and very high. So we assume it uses lossy compression.
In this test, we use a very high level.
ShortPixel
ShortPixel is an easy to use, lightweight, install-and-forget-about-it image optimization plugin that can compress all your past images and PDF documents with a single click. New images are automatically resized/rescaled and optimized on the fly, in the background.
ShortPixel provides 3 options for compression: lossy, glossy and lossless. In order to use ShortPixel, you have to create an account on their website. The free account allows you to optimize 100 images / month. And there's no file size limit.
WordPress Image Optimization Plugins Comparison
Ok so, enough talks about plugins. Let’s take a look, how exactly these plugins are in practical. In my example, I will be using an image in both JPG and PNG format. Optimize them, and then compare above-mentioned optimization plugins.
Here is the testing image we took to compare and the original dimensions.
File Type: JPG
Dimensions: 1920x1279 pixels
Size: 246,198 bytes
Source: Pexels (download the original image)
Result
| Plugin | WP Smush | EWWW (Lossless) | TP (Lossy) | ShortPixel (Lossless) | ShortPixel (Glossy) | ShortPixel (Lossy) |
|---|---|---|---|---|---|---|
| File Size | 227,038 | 227,038 | 135,401 | 226,121 | 122,726 | 81,145 |
Looks like ShortPixel is the best WordPress image optimization plugin, in both lossless and lossy test.
I Don't Want to Compromise Quality, What Should I Do?
Well, it is always suggested to optimize images. But, if you still want to keep the original image, use a Lazy Load plugin in which images will only be displayed when they are visible in the browser. This will reduce the initial page size as images will be loaded when the user scrolls down the page.
Choose Theme Wisely
There are numerous free and paid beautiful themes available but coded badly. Optimizing images will somehow help in speeding up a WordPress site but it is always suggested to use a lightweight and nicely-coded theme like our themes.
See our detailed guide on choosing a WordPress theme.
Choosing Decent Hosting Provider
Always remember, if your hosting server performance is poor, your website will definitely perform poorly. Therefore, you need to have a decent hosting provider like Cloudways — a managed WordPress cloud hosting provider.
For our visitors, we have broken a deal with Cloudways. You can get $25 FREE cloud hosting credit using the coupon code GRETATHEMES.
Wrapping Up!
It is always suggested to optimize images before uploading them to a WordPress site. Later on, use an optimization plugin like WP Smush, that clearly beats the other plugins in our tests. You can also integrate a CDN with a WordPress site that will cache static content like CSS, JS and images that will help to boost the performance.
- Image Optimization In WordPress: Beginner Guide And Plugins Review
- 7 Best Cleaning Tools for your WordPress Website
- 7 Ways to Speed Up Your WordPress Website
- How to Use Autoptimize Plugin to Increase Your Website Speed
- A Guide to Speed up Your Website Using CDN
- Top Plugins To Increase Your Website Speed
Above all information is very useful for us,
I am using a new and very good plugin to resize my image and speedup site, it is very promising,
you can see it here https://wordpress.org/plugins/way2enjoy-compress-images/