[Turbo Series] Optimize and Scale Your Images

In our last post, we spoke to great lengths about establishing benchmarks so we’re able to determine if we’re making improvements/progress or not.

“What gets measured, gets managed.”

Moving on to the next step, we’re going to take a look at the the one thing that, with 20% of your focus, will provide 80% of your performance boosts – I’m talking about image optimization. Images often account for most of the downloaded bytes on a web page and also often occupy a significant amount of visual space. Thus, optimizing images can often yield some very large byte savings and performance improvements for your website. The fewer bytes a prospective client/customer has to download in their web browser, the faster it can download and display useful content on their screen.

Part 2

Before we touch any tools, let’s establish some basic guidelines for using images on websites. The most important points are:

  • Image Format – There’s a reason to use .jpeg or .png. If you’re looking to use photos where maximum resolution, clarity, and color are not important, use JPEG. If it requires a transparent background, use PNG.
  • Quality Settings – If using high resolution images, there’s nothing wrong with using “Save for Web” (in Photoshop) or exporting images at 60-70% of quality.
  • Scale Images – Whenever possible, scale the size of your images before uploading them. Using code to resize images is not efficient.

Now that we’ve gotten that out of the way, here at Momentum, we have several image optimization plugins for WordPress that we like to employ for our site and our clients.

Imagify

Imagify is a relative newcomer to the WordPress image optimization plugin game. It was created by the developers of WP Rocket, a well-known caching plugin. Like the other plugins tested, an API key was required to begin using the features. The Imagify interface is relatively straightforward, maybe even a little sparse compared to some of the option offered by their competitors. Depending on your knowledge level this might be good or bad.

Imagify optimizes the popular image formats including JPG, PNG and GIF. They offer a variety of price points:

  • Free Plan– This plan offers lifetime usage upon registration which includes a 2MB Max file size and 25MB/month of optimizations. These limits apply across all websites
  • Monthly Plans – With 5 price points there is something for everyone. Lite plans start at $4.99/month for 1GB optimizations and unlimited file size. At the top of the range is the Enterprise plan which costs 69.99/month for 50GB/month. There are annual discounts available as well.
  • One Time Plans – These plans are great for one-off projects. Price are set at $5.99, $9.99 and $19.99 for 500MB, 1GB and 3GB respectively.

ShortPixel

ShortPixel splits the difference between features and simplicity. Their dashboard provides both settings and statistics for your current plan. Optimizable image formats include PNG, JPG, GIF and PDF.

Features included with ShortPixel:

  • Compression – Available compression includes both lossless and lossy and both are available with the free version
  • Image Sizes – All thumbnail image sizes can also be compressed but each one counts toward towards your monthly image limit
  • EXIF Data – You can opt to remove all EXIF data but not individual elements
  • Resize Images – All uploaded images can be resized to a maximum width or height

ShortPixel offers a variety of pricing options including:

  • FREE – One of the best free plans available. You can optimize up to 100 images with lossy or lossless compression and no file size limit.
  • Paid Plans – Starting at just $4.99/month for 5000 images (no size limit) with their Short plan and moving up to $29.99/month for 55,000 images on their XXL plan.

WP Smush

Probably the most popular but least effective image optimization plugin.

A few of the most important features include:

  • Bulk Smush – You can bulk optimize up to 50 images with a free account and an unlimited number as a pro user
  • Images Sizes – Decide which image sizes you want to optimize
  • Exif Data – You can opt to preserve EFIF data, however you can’t select exactly which data to keep as with Kraken.io
  • Resize Images – Original images can be resized based on a maximum width or height
  • Conversions – PNG images can be converted to JPEG. Images with transparencies are ignored where EWWW will also convert transparencies and enable a user-specified background color
  • Super Smush – Allows you to compress images up to 10x more than the free version with minimal degradation (lossy).

Price points are as follows:

  • Free – The free account offers limited functionality that includes lossless compression, 1MB max file size, resizing and EXIF preservation.
  • WP Smush Pro – This option is included as part of the WPMU subscription plan at $49/month. You’ll be able to smush images up to 32MB in size across unlimited websites.

Comments

  1. Hiya, I am really glad I have found this info. Today bloggers publish just about gossips and internet and this is actually frustrating. A good site with exciting content, this is what I need. Thank you for keeping this website, I will be visiting it. Do you do newsletters? Cant find it.

  2. Hmm it appears like your blog ate my first comment (it was super long) so I guess I’ll just sum it up what I had written and say, I’m thoroughly enjoying your blog. I as well am an aspiring blog blogger but I’m still new to everything. Do you have any recommendations for first-time blog writers? I’d certainly appreciate it.

  3. I simply couldn’t go away your website prior to suggesting that I extremely loved the usual information a person supply for your visitors? Is going to be back often to investigate cross-check new posts

  4. I and also my guys were examining the nice thoughts from your web site and so the sudden I got a terrible suspicion I never expressed respect to the web site owner for those secrets. My ladies had been totally excited to read through all of them and have now sincerely been tapping into these things. Many thanks for genuinely well thoughtful and for selecting such important things most people are really wanting to discover. My honest regret for not expressing appreciation to earlier.

  5. I found your weblog internet site on google and check a number of of your early posts. Continue to keep up the really beneficial operate. I just extra up your RSS feed to my MSN News Reader. Seeking forward to reading extra from you later on!

  6. Immediately after study a few of the weblog posts in your internet site now, and I truly like your way of blogging. I bookmarked it to my bookmark site list and will likely be checking back soon. Pls have a look at my website as well and let me know what you believe.

Leave a Reply

Your email address will not be published. Required fields are marked *

Download Mac's CTIA Presentation Now!

Why wait? Start improving the digital presence of your Repair Company today!!
DOWNLOAD!
Or see below to view Slideshare!