A Comprehensive Guide to WordPress Image Compression
In this guide, we’ll introduce you to the concept of compression and explain how to optimize images for WordPress. Then we’ll share a handful of helpful plugins and tools you can use.
Using images on your site is smart for many reasons. They make your site look more attractive, and help your other content appear more engaging. Unfortunately, hosting a lot of images on your site comes with some downsides, such as increased loading times.
The trick to solving this is using image compression. By compressing your images, you can shrink down their file sizes without affecting their overall quality. This will ensure that your site runs quicker and more reliably, which will have a positive effect on your users’ experience and your bottom line. Let’s get started!
What Image Compression Is (And Why You Should Care)
Everybody knows that an image is worth a thousand words. However, a modern twist on this idiom might be that an image takes longer to load than a thousand words.
Image file sizes are often massive, especially if they contain uncompressed, high-quality photos. While these images can make your site look amazing, they also slow down your loading times. If your site is sluggish, that is likely to negatively affect your users’ experience, have a direct impact on your bounce rates, and hurt your conversions.
For example, did you know that almost half of all internet users expect a site to load in two seconds or less? Even a single second of extra delay can reduce your conversions significantly. In short, slow loading times is not a problem you can afford to ignore.
This means you need to find a way to speed up your site, without having to remove all those images. The answer is image compression: shrinking the file size of an image without noticeably affecting its overall quality. Fortunately, optimizing your images this way isn’t difficult.
How to Prepare Images For Your Website
First, let’s address some ways you can prepare images yourself before optimizing them. The following techniques will give you a head start:
- Create smaller versions. The most obvious reason behind a hefty file size is when an image has large dimensions. This is especially common with photographs. It’s rare that you’ll need to use full-size images on your site, however, so consider creating smaller copies.
- Remove Exif data. Exif data is metadata that is automatically added to photographs. You might not even be aware that this data exists, but it can increase file sizes considerably (and contain potentially sensitive information). For that reason, we recommend removing it entirely.
- Save images for web use. Some image editing software enables you to prepare your images specifically for web output. For example, Adobe Photoshop contains an option to “Save for web.”
Each of these methods will make your optimization efforts more successful. Just remember to save and backup the original, unedited images separately. Once you have web-ready versions of your images, it’s time to compress them.
An Introduction to Image Optimization Tools
When it comes to compressing images, you have a few methods to choose from. You can install a WordPress plugin (which we’ll look at later on), download a piece of software, or use a browser-based tool.
Your first impulse may be to go with a plugin, but the other options have their advantages as well:
- No strain on your server— Since the image optimization happens off your site, your server will not be affected at all.
- No need to worry about backups — Since you’ll keep both the original files and the compressed versions, you don’t need to create backups.
- No site compatibility issues — If there’s a problem during the compression process, it won’t affect your site.
However, using one of these tools does also come with its downsides. It adds an extra step to the process, for example. It’s best to consider both the pros and cons before you decide which solution is right for you.
If you decide to go with offline software, there are plenty of options to choose from. Plus, there are a number of image optimization tools you can use right from your browser, including:
TinyPNG — This is one of the most user-friendly tools available. Simply drag and drop your images onto the page, and the tool will optimize them right away. When it’s done, you can download the optimized images individually, or together as a zipped file. Kraken.io — This is another user-friendly, browser-based tool that enables you to select the level of optimization you want, and gives you the option to resize your images. It also offers paid plans with additional features, which start at $5 per month.
What’s more, WordPress lets you manually filter JPEG image compression quality by adding a code to functions.php, ensuring backwards compatibility. Of course, using a dedicated plugin is also an excellent solution that’s worth checking out. Let’s look at how you can use a WordPress plugin to perform the image optimization process automatically.
4 Image Compression Plugins for WordPress
The time has come to look at how you can integrate image optimization directly into your WordPress site. Here, we have selected four of the best image compression plugins. They all have unique features and abilities, so let’s dive right in!
1. Jetpack Image CDN
Jetpack, a popular toolkit plugin for WordPress, contains service-based image optimization in the form of Image CDN. Formerly known as Photon, this module lets you speed up the load times of the images on your site by toggling a single setting (located in Jetpack > Settings > Writing).
Image CDN utilizes the image_downsize filter to rapidly optimize images on posts and pages, including featured images and thumbnails. Once the Speed up images and photos setting is selected, all of your posts will have their images optimized using Image CDN.
Key Features:
- Automatically resizes optimized images so they don’t compromise the appearance of your chosen theme.
- Is incredibly easy to set up.
- Filters content without changing image information within the database.
Pricing: The free version of the Jetpack plugin contains the complete Image CDN feature, although premium plans are also available. DreamPress Plus and Advanced users are also in luck: Jetpack Professional is included with your hosting plan.
2. Compress JPEG & PNG Images
Compress JPEG & PNG Images will look familiar to users of TinyPNG; it’s the plugin version of that tool. This enables you to use the TinyPNG service directly from your site, which makes it one of the most user-friendly options.
This plugin sends every uploaded image to the TinyPNG service to automatically determine the optimal way of compressing the image. That image is then optimized and returned to your site. Compress JPEG & PNG Images can also bulk compress your existing files.
Key Features:
- Enables you to automatically resize images.
- Compresses animated images.
- Converts images from CMYK to RGB, to save additional space.
Pricing: This plugin can be used for free to compress 500 images every month. After that, you can purchase additional compressions for $0.009 per image. TinyPNG offers a handy price calculator you can use to estimate your price, based on your requirements.
3. ShortPixel
ShortPixel is an intuitive plugin that is easy to use for beginners, and comprehensive enough to satisfy experienced users. One of its key features is that it automatically creates a backup of your original files. This enables you to try the plugin safe in the knowledge that your old images will not be overwritten.
This plugin works by automatically compressing all images you upload to your WordPress site. You can also bulk optimize your existing gallery, which we’ll look at in more detail later on.
Key Features:
- Offers three different conversion levels.
- Is capable of converting to WebP format.
- Offers free optimization for non-profit organizations.
Pricing: You can use ShortPixel for free, which includes 100 credits per month. One credit equals one optimized image, and you can buy more credits by getting a monthly subscription or a one-time plan.
4. EWWW Image Optimizer
EWWW Image Optimizer is another option that offers a lot of customization. This adaptive plugin automatically compresses your images based on their file extension, and even works with PDF files.
What’s more, 100 percent of the compression EWWW Image Optimizer performs is done locally. This means you benefit from a reliable, accelerated service, without images travelling to and from third-party servers. The plugin also offers a Cloud Edition that is even safer than the ordinary version.
When you use this plugin, it will automatically compress images based on their file types. It also offers a bulk optimization feature and ensures that images are automatically resized to fit your site.
Key Features:
- Uses SSL encryption for extra safety.
- Offers automatic backups for 30 days.
- Is capable of converting to WebP format.
Pricing: The base plugin can be used for free, but EWWW also offers several paid plans that start at $0.003 per image.
How to Optimize Images For WordPress With the ShortPixel Plugin (In 3 Steps)
By now, you’re familiar with many solutions for performing image compression. Before we wrap up, let’s look at how you can use a WordPress plugin to perform a bulk optimization process on your website’s images. For this example, we’ll use ShortPixel because it’s a solid, intuitive option for beginners.
Step 1: Request a Free ShortPixel API Key
After you have installed and activated the plugin, you’ll immediately be asked to provide an API key. This creates a connection between your site and the ShortPixel optimization tool.
You can request a free API key if you don’t already have one. Just enter your email address, and click on Request Key. A key will be generated for you, and you’ll also be set up with a ShortPixel account. When you have entered and validated your key, you will be taken to the ShortPixel Plugin Settings screen.
Step 2: Configure the Optimization Settings
If you don’t want to configure the ShortPixel plugin, you can leave the default settings alone. However, if you do want to customize the plugin, you can do so here. Let’s take a quick look at the General settings tab, which is all most users will need.
Here, you can decide if you want the plugin to also optimize your thumbnails, set the compression level you want to apply to all files, and remove EXIF data (as we discussed earlier). You can also back up your original images, and choose if you want the plugin to automatically resize images.
Click on Save Changes when you are happy with these settings. Alternately, you can select Save and Go to Bulk Process if you want to start optimizing your existing images right away.
Step 3: Bulk Compress Your Existing Images
The ShortPixel plugin will automatically compress all images you upload in the future, but it also enables you to optimize your existing images. You can do so using the Bulk Optimization Too, which you can access via Media > Bulk ShortPixel within WordPress.
Here, you’ll see the number of existing images on your site, including thumbnails.
To start the process, click on the Start Optimizing button. You can see in real-time how each image is compressed, including the total amount of saved space.
Once the process has finished, you’ll see a message confirming that all original images have been backed up and replaced with the compressed versions. From now on, you won’t need to worry about images slowing down your site!
Conclusion
You do not have to choose between having a fast site and using many beautiful images. By compressing your images, you make sure they don’t negatively affect your site. This will not only make your visitors happier, but it will also improve your site’s search engine rankings as well.