WordPress Image Optimization — ShortPixel
This Article is the abridged version of a longer article by my colleague Ben Davidson at Web Review Star.
There are many benefits to ensuring your site is as fast as it can be. Image Optimization is just 1 part of that but often a part that is overlooked. Most people will tell you that you should use Caching plugins for WordPress, or CDN networks like Fastly or Cloudflare to ensure your website is fast. They are not wrong, but there is more to speed than just caching, and fast web hosts. These are are important but Image Optimization is often left out as a part of that strategy.
Regarding Site Speed, of course, the basics are always the same
- Fast Web Host
- Only a few Plugins
- Fast Theme
- Caching and or CDN
Core web technologies like HTTP/2, QUIC, Brotli, etc. will get you 80% of the way to a fast site. Image optimization will get you past that.
What is image optimization and why do I need it?
Image Optimization is the compression and scaling of image files, this can sometimes be done simply by changing the file size (Megabytes and Resolution). If you take a picture with a decent camera you could have a 12 MegaPixel image or bigger. 12MP is 4000 pixels x 3000 pixels, by contrast, your laptop or computer resolution is probably 1920 x 1080, Mac users often have a higher resolution like 2880 × 1800. Then of course there are 4K and above. But I digress….
A single12MP jpg image file size is around 3.6 MegaBytes. So if you have just 4 images on your site that is about 17MB of data that someone has to load just to see the pictures, the rest of your web content may only be 900kb. Now some themes may display a smaller more manageable version of that file, by simply changing the viewable resolution, but it’s still going to be a big file.
These are some ways of improving your site load time by making changes to your images.
1. Have multiple sizes of each image, 8 to 12 ientical images, but different resolutions. Someone browsing your site with a smartphone can be served a smaller image than someone with a 4K monitor.
2. Use optimal image formats, convert PNG files to JPG, AVIF, or WebP. And know when to serve AVIF or WebP rather than JPG, It can get complicated.
3. You can also optimize GIF’s including animated GIFs and optimize PDF documents. Perfect if you host PDF manuals or informational books.
4. Downscale your images so that they have a smaller file size, but be careful, you don’t want to lose too much image quality.
5. Do this for every image on your site. it might take a very long time but it’s worth it, right?
6. There is a better way of doing all of the above and more, and it’s Free? Well, kind of free.
This is where ShortPixel comes in.
Firstly the ShortPixel WordPress plugin is easy to use. It’s also feature-rich. The software supports JPG, PNG, GIF, PDF, WebP, and AVIF. WebP and AVIF are quite new and not all browsers support these formats, but with ShortPixel it will serve the image best suited to the browser. It also automatically creates multiple image sizes, allowing you to automatically serve the image that is best suited to the device that is browsing the site. You can also set if you want your images to be Lossless, Glossy, or Lossy.
How to use ShortPixel in WordPress
As with most WordPress plugins that use the cloud, the basic workflow looks like this:
- Upload your image to your site’s WordPress Media Library, as normal you always have.
- The ShortPixel WordPress plugin will then send your images to their cloud servers (this will happen automatically when you upload an image, or you use the bulk optimization option perfect for images you already have in your Media Library).
- Based on the settings you’ve chosen in the plugin’s settings, ShortPixels cloud service does the heavy lifting. Not your web host. This is important as it has no impact on your site performace while the images are being optimized
- Once done the plugin puts your image back into your site’s WordPress Media Library. Replacing the existing unoptimized version that’s there. This is non-destructive though, as you can always revert to your original image.
Ok, So how much does it cost?
The WordPress plugin is free. The plugin won’t do anything by itself though, not without connecting it to the ShortPixel cloud service.
Get Mike Chow’s stories in your inbox
Join Medium for free to get updates from this writer.
The service also starts Free, just sign up to ShortPixel for FREE and get 100 Images optimized per month for FREE. It’s that easy.
There is a free plan for the cloud service, but it’s limited to only 100 images a month. That may not be enough for you to start with, or it could be the perfect git if you are just starting out.
If you need to process more than 100 images a month, you’ll need to buy credits. You can either buy credits through a Monthly Subscription or with a One-Time purchase of a credit bundle.
The ShortPixel One-Time, or Pay as you go, pricing starts at $9.99 for 10000 images.
The Short Pixel Monthly Plan starts at $3,99 for 7000 images.
Depending on your usage requirements a One-Time bundle might last you 6 months or more.
But wait, there is more! Image delivery via CDN, including a Free Tier!
So not only does ShortPixel reduce load times by compressing and resizing images automatically, but it also converts images to new formats for the browsers that support them, saving even more bandwidth and speeding up content delivery. They also offer you 500MB of free CDN traffic. The ShortPixel Adaptive Image Plugin for WordPress deserves its own article.
ShortPixel Adaptive Images replaces all your website’s pics with properly sized, smartly-cropped, optimized images and offloads them onto ShortPixel’s global CDN. Their CDN also caches and serves CSS, JS and fonts. If you are using an exiting CDN it may be best to test them side by side to see if which gives the better performance. Also using 2 CDNs may not increase your performance. So if you already use Cloudflare or Fastly etc. you may have to make some changes or choices on which CDN works better for you.
The ShortPixel Adaptive Image One-Time pricing starts at $9,99 for 50GB of CDN image traffic, or about 50000 visits.
The ShortPixel Adaptive Image Monthly Plan pricing starts at $3,99 for 35GB of CDN image traffic, about 35000 visits.
ShortPixel vs Kraken.io and Optimus
Shortpixel isn’t the only game in town when it comes to optimizing images in WordPress. Two other options that have similar features are cloud-based and have similar costs and pricing models are Optimus and Kraken.io.
All three offer lossless and lossy optimization options. They all have batch automation and have WordPress plugins that handle the optimization in the background. They are all very easy to use too. Even the output file sizes and quality are similar from a compression ratio perspective.
But there are some important differences.
ShortPixel’s pricing model is based on a number of images processed and can be a once-off bundle.
Optimus’s pricing structure is a flat-rate price for an annual license, you can process an unlimited number of images. For $29 per year you get unlimited images processed but a maximum file size of 10MB.
Kraken.io is based on the amount of data processed. As an example, $9 per month gets you 2GB of pictures processed.
You can also use some CDN networks like Cloudflare, they also have a paid tier for Image Optimisation, it starts at the Pro Level for $20
The full article on ShortPixel Image Optimization for WordPress is available on Web Review Star
