Image Optimization for the Web
I always selected Maximum quality when saving my files in Photoshop. The world needed to see every last pixel when I was creating my masterpiece.
I know, my Sgt. Pepper’s album cover was fun, but the whole world didn’t need to see it at 6000×6000.
Little did I know, that every time I uploaded an image to my early WordPress website, I was doing it wrong.
We have been talking about website speed all month and the importance of making your site fast. People like me (living in rural areas) have a hard time loading websites with tons of images. Taking a picture directly from your iPhone or even uploading the Maximum Quality JPG will impact your website load speed.
Fast Website’s = Better Conversions
Through my years of online training, I found several great tools to help optimize images and not kill the overall quality.
The Premise of The KitchenSinkWP Podcast
When I first discovered and searched for WordPress Podcasts, I came in contact with The Kitchen Sink WordPress Podcast. I loved how the episodes were structured and quick. The host, Adam, seems to know his way around WordPress.
My name is Adam Silver and I started working with WordPress in late 2009. Why you ask? Well it was due to the fact that I needed a new website for my Photography business. I was running a REALLY old template in static HTML and updating it was a pain in the @#@#. I tried Joomla for about a month and wasn’t happy with that. Then I heard about and found WordPress! Haven’t regretted my choice at all!About Page on KitchenSinkWP.com
I’ve been subscribed for a while now and this podcast is part of my regular rotation. Anyone using WordPress could benefit from giving it a subscribe.
Why Did I Pick a Podcast about Image Optimization?
The trend over the last few years has been image heavy websites. There are plenty of sites with huge carousels or sliders. Pinterest and Instagram are social media websites that are primarily images. You don’t see your standard plain HTML sites (unless you are heading to Craigslist or Wikipedia). Since website speed matters and you are likely to use images all over your site – those images better be small or your user experience will be poor.
Now Adam does go over some very helpful tips, but he does a better job at uncovering a few of the tools/plugins to use to help optimize your images. He talks about the following:
- TinyPNG – no stranger to anyone that regularly reads my blogs
- ShortPixel – we talked about this several weeks ago
- ImageOptim – this was a new one for me.
He even talks briefly about a previous episode he dedicated to Retina Display images.
A Few Additional Tools
It sounds like Adam was using TinyPNG before he recorded this episode. This was my preference, but I have also sampled several other WordPress plugins.
Smush Image Optimization
I’ve tried the Smush plugin for several of my WordPress websites. This was helpful for automating the entire process. Instead of having to drag and drop 20 images at a time, I could upload to WordPress as normal and the plugin did the rest.
Over time, I stopped using Smush and opted to just go the TinyPNG route. Mainly because I added the Photoshop add-on for TinyPNG and I also try to limit the amount of plugins active on my WordPress sites (speed, you know).
Imagify is a plugin that I recently found. Besides optimization, it also will convert your images into different formats for the web. This is often suggested during your Website Speed Tests and can do wonders for your page load time.
Not sure what Next-Gen image formats are, I found you a link.
I have been using this plugin on my website for a while and seems to do the trick. Some images you have to disable the optimization – based on the way the theme was built – but for most it works just fine.
The Podcast: “Image Optimization Tools and Services”
This podcast is quick and easy to understand. There is about a minute of housekeeping at the start and the end, but nothing you must skip.