Image optimization is one of the simplest ways to boost your website speed.

Easily optimize images using the correct image type, size, and a free plugin for WordPress.

Most of us on the net are looking for information quickly from the websites we visit and landing on a page with slow loading images is frustrating and disappointing.

Some of the most frequent offenders are recipe and lifestyle blogs which use beautiful, but extremely large and numerous image files.

I prefer to stay on a site because I want the information, but if it drags too long, I have to leave and find another source. This results in negative SEO for the website.

Poor website speed equals poor SEO and while SEO is important, great user experience on your website is truly what you should be aiming for.

The last thing I want to happen when you visit my site is to have your cell phone freeze or for my images to distract you from the information I have worked to provide to you.

In this post, I am sharing how I have been able to optimize images and dramatically increase my Google PageSpeed Insights rating (the link is below under references).

Choose the Correct Image Type

There are three universal formats: GIF, PNG, JPEG

GIF is Graphics Interchange Format which supports animations and is suitable for simple graphics and logos using solid colors.

PNG is Portable Network Graphics and supports higher quality images for the web. Use PNG images only when you need to preserve fine detail and the highest resolution. PNG file sizes are larger than JPEG files.

JPEG is Joint Photographic Experts Group and supports high-quality images for the web. Use JPEG or JPG images when you need good quality images. JPEG files are generally the best choice for image optimization.

Upload Scaled Images

Image optimization boils down to two criteria: optimizing the number of bytes used to encode each image pixel, and optimizing the total number of pixels: the filesize of the image is simply the total number of pixels times the number of bytes used to encode each pixel. Nothing more, nothing less.

As a result, one of the simplest and most effective image optimization techniques is to ensure that we are not shipping any more pixels than needed to display the asset at its intended size in the browser. Sounds simple, right? Unfortunately, most pages fail this test for many of their image assets: typically, they ship larger assets and rely on the browser to rescale them – which also consumes extra CPU resources – and display them at a lower resolution.

Use Free Image Tools

A well-liked photo editor is picmonkey.com. They have a free option to resize images. It is easy to use if you need to replace images on your website.

Another popular tool is canva.com. They offer standardized dimensions for blogs and social media posts.

I get most of my images from pixabay.com free. I download a medium image, upload it to Canva, add it to a blog title and then add my text. Then I save it and download it to my computer.

Next, I upload my blog post image into compressjpeg.com and then download the compressed image and delete the original images from my computer. It saves space and reduces clutter on my hard drive. I upload the compressed (-min) file to my website media files.

Install the Free Plugin EWWW Image Optimizer

A note about plugins: Always test plugins on a test website with your current theme if you have it available and consider installing the plugin WP Rollback so you can rollback any changes a plugin or theme makes in case there are issues.

After I installed EWWW Image Optimizer and ran the bulk optimization, there was a great improvement in my page speed rating from Google.

EWWW Image Optimizer uses Lossless Data Compression which is a technique that reduces file sizes without degrading their visual quality.

I have a lot of media files, so the bulk optimization did take some time to run, but the results were excellent.

After re-checking my page speed, I found there were a few files that needed to be resized and replaced and that was easy to do. The results have been well worth the effort.

This plugin has a 4.5 out of 5 stars rating, 300,000+ installs and was updated the day of this post. There is an API subscription available if you need more advanced features.

Also, there are video tutorials available on the Installation page. Please review the installation page to be sure you understand how to operate the plugin.

An alternative plugin I have seen recommended is Kraken Image Optimizer. It has a 4.7 out of a 5 stars rating, 10,000+ installs and was updated 3 months ago. There is a free version and a paid subscription available.

In Summary

Use JPEG files, upload the correct file size to your website, install and run EWWW Image Optimizer, resize and replace any remaining images slowing down your site.

References

Google Developers PageSpeed Insights
Google Developers Image Optimization

Thank you for reading How to Optimize Images for Better Website Speed. Do you have a helpful tip or a question? Leave a comment below!