How to Compress Images for Websites

Always Optimize Images before Uploading to a Website – Here’s Why

To ensure a website provides a quality user experience and performs well in search engines, it’s important to deliver a fast-loading website.  
Why? Because everybody can agree, a slow-loading website is the W-O-R-S-T.
Fortunately, one of the best (and often easiest) ways to improve page speed starts with image optimization.

But before diving into image optimization, let’s discuss page speed in general.

Why Page Speed is Important

1.    User Experience: 53% of mobile site visits are abandoned if it takes more than 3 seconds to load.

2.    Google’s Algorithm: Site speed is a ranking factor for SEO and Google is increasingly pushing for fast loading sites.

It’s undeniable a fast-loading website is a key to online business success.  

What Happens When Images Aren’t Optimized

Google wants to Make the Web Faster and offers tools such as Google PageSpeed Insights and TestMySite.

These tools take image optimization seriously and will sometimes give a 0/100 score for page speed when there are heavy, un-optimized images. Oftentimes, the site might have an exceptional TFB (time to first byte) and visually load quickly, but still receive a very low score due to the poorly optimized images.

For example a site could have a satisfactory TFB, but receive a score of 0/100 on Mobile and Desktop mainly due to a 6 MB image in the homepage slideshow.

When to Optimize Images

Always!  While some Content Management Systems have built-in image compression, most do not.  Any time a new image is loaded to a website, it’s important to optimize accordingly.
Please note: Built-in image re-sizing (changing the dimensions or height and width) is different than built-in image compression (changing the ‘weight’ or file size itself).

How to Optimize Images

Before uploading an image to a site, check the size of the file (right click on the saved file and view properties). If it’s over 1MB, it can likely be saved as a more condensed file size without sacrificing the quality of the image.  Aim for under 500KB, ideally under 100KB.

Image Compression Tips Include:

  • Save as 72.0 PPI resolution.
  • Use ‘Save for Web’ in Photoshop
  • Save as a JPG for photographs
  • Save as a GIF for images with large blocks of flat color

Tools to Compress:

  • Photoshop
  • Google PageSpeed Insights (after scanning the site, there’s an option to download the optimized image).
  • Web based tools:

Additional Resources

Check out these Image Optimization Web Fundamentals from Google.

Or read ‘How to Improve Page Speed for Your Website’ for more tips on page loading optimization in addition to image compression.

Thanks for reading and don’t be afraid to reach out with any questions!

Contact Us

About Author

staff at has a dedicated team of strategists, technologists, and content writers to help you stay up to date with the latest and greatest trends in the technology industry. We cover a wide variety of topics on a regular basis, some of which include website design, website development, digital marketing services, ecommerce, accessibility, website hosting and security, and so much more. Educating our clients, prospects, and readers is very important to us and we appreciate the opportunity to be an authoritative voice in the industry.

Featured Posts