Posted at Dec 29, 2018 9:08:00 AM by Michelle Sternbauer | Share
It's no secret that speed is one of the most important factors to keep in mind when redesigning your website. With so many people visiting the mobile versions of websites from their phones, you want your site to load quickly over a regular cellular connection. In fact, data from Google shows that 53% of website visits are abandoned on a mobile device if it takes more than three seconds to load.
The Need for Speed
A key factor that can greatly impact the speed of your website is the size of your image files. Current trends in web design lean toward placing large, eye-catching images in headers and pages to captivate and draw in website visitors. However, you don't want to include these kinds of images at the expense of your site speed.
Optimize Images for Users and for SEO
Making sure that all the image files on your site are optimized is important both from a user perspective as well as from a search engine optimization (SEO) perspective. You don't want your site to be so heavy with un-optimized images that it affects your site ranking.
There are two parts to optimizing images for your website:
File type – The most common file types for images on the web are .jpg and .png. As a general rule, .jpg files are fine for most photos going on the web. The .png format can be helpful at times, because you can save images with a transparent background (this is especially useful for logo files).
File size– The most important part of optimizing your images is reducing your file sizes. When doing this, there is a balance between the size of your file and the quality of your image. You don't want to reduce your file size so much that you lose image quality. A good rule of thumb for image resizing is to try to keep your images under 300 KB.
Practical Tools for Image Resizing
There are a number of programs and plugins that can help you reduce the size of your images. If you have them available to you, both Photoshop and Lightroom can easily compress a batch of images all at one time.
In addition, Google has recently come out with an excellent image resizing and compression tool that is available for free at squoosh.app. The Google tool allows you to both compress as well as resize images, plus it provides a preview so that you can keep an eye on image quality as you reduce the size of your files.