How To Find The Images That Slow Down Your Website
Page load times are more critical than ever. Your visitors expect instant access to everything, all the time. Whether it’s paying bills, shopping, reading articles, or watching videos, if there’s any delay, your site’s users will go to the next thing or they will be left disappointed. Over the last several years, the average page load speed has increased, but our attention spans have certainly become shorter.
To prove that theory, Google analyzed 11 million mobile ads’ landing pages across 213 countries. Their results revealed that as pages load time increased from 1 second to 5 seconds, the probability of a user bouncing increased by 90%. They also discovered that as the number of elements on a page, such as images, titles, and text, increased from 400 to 6,000 elements, the probability of conversion dropped by 95%! Furthermore, a survey from HTTP Archive that was released in December 2017, found that images make up, on average, 54% of the webpage’s weight.
If your site is dealing with slow loading times, your library of images might be the culprit. High resolution images are great for designing eye-catching websites, but their large file size will undoubtably slow down your website, making the user experience less than ideal. An easy way to avoid heavy images is not to upload them in the first place. Make sure you optimize your images by compressing them with ShortPixel before uploading them to your site. Your pages will load faster, and your visitors won’t even see a difference in image quality.
However, let’s assume you’ve already uploaded images to your pages and you don’t know if they’ve been optimized. How can you identify which images are slowing down your website? One quick and painless way is to use a website speed test tool, such as the one from Dotcom-Monitor, which helps you detect performance issues.
How to test your website’s speed
The website speed test tool from Dotcom-Monitor is a free tool that allows you to simultaneously test your website’s speed from 25 locations in seven regions, including cloud-based (AWS US-East) and even from behind the Great Firewall of China (Shanghai). Additionally, you can select from seven desktop/mobile browsers – Android, Blackberry, Chrome, Firefox, Internet Explorer, iOS, and Windows Phone. By default, the test is setup to run a repeat visit, which shows how the browser performs if it has already cached certain page elements.
This information is useful for quickly identifying and resolving troublesome images, or other elements, such as CSS, JavaScript, or plugins that may be causing the page to load slowly. Once a test is complete, you can focus on specific elements within the Performance Reports and Waterfall Charts. The Waterfall Chart displays the load times of the elements in the order they were loaded along a timeline. This is where you can identify the image or images that are slowing down your site’s page loading time.
Conclusion
Remember, the page loading speed is relative to the actual user. Factors such as physical location, connection, device, and browser must all be considered when someone visits your site. Even if you don’t hear about any issues, it’s a great idea to get into the habit of proactively analyzing your page loading speeds. This ensures that your site is performing as you intended and allows you to catch the potential performance bottlenecks your visitors may be experiencing. Additionally, a speedy website ranks well in search engines. Also, faster loading pages mean better customer engagement, retention, and conversion. Who wouldn’t want that?
Author: Matt Schmitz is a web performance engineer and director of Dotcom-Monitor’s web performance division. Matt is a leading authority on page speed optimization and has been featured by a number of web performance blogs and media outlets. When he’s not working to make the web a faster place, Matt’s interests include gaming, cryptocurrency, and martial arts.