Don’t let your site’s slow, ‘heavy’ images hurt your SEO rankings!
According to Search Engine Watch, the size of webpages sent to mobile devices has quadrupled in just the last five years. The main cause is images, which account for an average of 68% of total page weight.
If you’ve been following my posts, you know that Google now regards page load speed a very important ranking factor. Combine this with the fact that Google’s “mobile-first index” is on track to kick in during 2017, and suddenly it’s time to seriously analyze your website to see what changes you can make to optimize your site’s images.
An excellent tool for testing how quickly your site loads is WebPageTest. It measures speed, size and load times for every image on the page, and load times for scripts and css. The results can be overwhelming because there’s so much geek-type information, but for this post I want to discuss just the issues your site may have with regard to the images it contains.
Before we get started, have a look at the first section of the results (pink arrow). This shows you a letter grade for six key factors effecting the speed of your site. This site performs miserably for First Byte Time, something my client should address with her hosting company. Next, look at the Performance Results Median Run, particularly the Load Time (blue arrow). Research indicates the average website visitor has about six-seconds worth of patience they’ll grant while a page loads before their frustration level maxes out and they move on to your competitor’s site. So if the load time exceeds six seconds or so, you need to get to work, this site is roughly nine seconds, so I’ll be getting to work thinning it down.
A new feature is the Image Analysis (orange arrow). For image analysis, this is the most instructive part of the test. Click it and you’ll see an overall grade, Page Image Score. (A special sort-of-kidding note to my “fragile-egoed” photographer buddies: this is not a judgment of how good a photographer you are!)
Below the overall score area, you’ll see each of the page’s images listed with information regarding how much they might be reduced in size. In the screengrab above, a huge image, the Atari 2600 console, was uploaded to the WordPress Media Library at a whopping 1920×1121 (240 KB) but is being displayed on my website at just 461×269. By simply resizing the image’s dimensions and saving it as a JPG, I can reduce the image’s size to roughly 22 KB, about nine percent of it’s original size! For clarification, the large 7.9% shown is the reduction if the image was resized and saved as a WEBP. Unfortunately, this format is not yet supported in some browsers and utilizing it wouldn’t be prudent.
Now is the time to review all the images on your site, especially those on the home page, reduce their sizes where possible, and make your site as lean as possible. You’ll likely be very surprised at the bloat you’ll be able to cut out… and your search rankings will almost surely benefit. Good luck!