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
- Paint.net
- 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
