The power of a good visual on a web page or within a blog post cannot be overstated. It’s the icing on the cake, the ooh to your aah and the one thing that can attract those who are more visually oriented onto your page. Images are essential, but they can be slow to load. Now that every web page is graded on loading speed, what is a website owner to do?
Page load speed isn’t just about how long you keep your visitors waiting, it also has an impact on SEO. Google now ranks your site according to how fast it loads among other things. So the slower the page, the lower the rank. Plus, with more and more people surfing on a mobile device, loading speed and rendering on smaller screens is more important than ever.
When considering images, you have three options.
We all read differently. Some people like me love words and will be drawn in by a good headline. Others, are more visually oriented and need something colourful or shiny to lure them. A good blog post or web page needs to attract both, which is why good images are essential.
So how can we speed up image loading on a website?
The first option is to use smaller and/or lower quality images. Digital image size directly equates to file size. The higher the quality of the image, the larger that image is. The larger the image, the more time it takes to load.
Smaller images may be acceptable if they can maintain the user experience but it isn’t often someone will be as drawn in by a 350×350 image than they would by a 1024×1024. However, if it can work, all the better.
Image hosts are third party websites that host your images. You add the link to that image onto the page and the two connect together. The image appears on the page or within the post as normal, but isn’t hosted on your website. Depending on the image host you use, it can be as fast or even faster than hosting the image yourself.
A popular image host is imgur. Just create an account, upload the image, copy the link, add the link onto your page and voila. The image appears and the user experience maintained. Other image host services are available.
Optimising your images before you upload them to the page is usually the best way to speed up load times while maintaining the look you want and the user experience. I tend to use WP SmushIt which has both a free and premium option. It strips out all the unnecessary data from the image while keeping the original look.
There are other image optimisations you can make such as using ‘save for the web’ in Photoshop if you use it. There are also third-party desktop image optimisers as well as web-based ones. By removing all that extraneous data from images, the size shrinks without impacting the visual loveliness of your site.
There are a few more things you can do to speed up image loading such as ensuring your website theme (if you use one) is also optimised, configure ‘lazy loading’ where only the image above the fold of the page is loaded and others follow as the user scrolls down, using a content delivery network (CDN) and using a WordPress cache plugin if you use WordPress.
I will endeavour to cover each of those another time!