Pictures are great. No one wants to read a thousand words anymore, but pictures? We’ll digest encyclopedias-worth of pictures anytime. That’s why everyone wants pictures on their website, and they want those pictures in the highest quality. But large, high-resolution images take longer to load up on a webpage, which can be frustrating to users. That’s where image optimisation comes in.
Of course, improving page speed isn’t the only reason to optimise an image. When it comes to images, there are several reasons why they should be optimised for your website.
Web page load speed
Optimisation is the process by which you make something more efficient and effective for its purpose. When it comes to pictures, a large part of this is making your images look as good as possible while also keeping the file size as small as possible. Visitors to your website are only going to wait patiently for three seconds for your site to load on a desktop or laptop, or about five seconds on a mobile device. Considering that Amazon discovered that a one second slow down in their page speed would cost them $1.6 billion per year, you can imagine the urgency.
We optimise images to make sure there is less information to be loaded up when accessing a webpage, meaning it takes less time to be ready for the user. This is done using techniques that make the image smaller and contain less information, but without making the image deteriorate in visual quality to any obvious degree. Understandably, some websites need to have high-quality pictures to demonstrate what they offer. This is fine, but they should not be placed on the webpage in their high-resolution form and shrunk in size via the source code because this will add several seconds to the load time. Instead, you can use an optimised image for the web page with an option to view the larger image as a pop-up or on a new page. There are more advanced coding methods for displaying an optimised image based on the end user’s device size too. Add to this some brand-new image formats coming up the pipe and there really isn’t an excuse for your site’s imagery to slow down the user’s experience.
A faster loading web page means a better User Experience (UX), which is important not just for your client retention, but also for your Search Engine Optimisation (SEO). As we’ve previously discussed, the better the UX, the better the SEO, and optimised images help with both of those.
Naming the image
It’s not all about what you can see, however. Optimisation includes making the images as SEO-friendly as they can be. Naming an image doesn’t seem like something that you should need to worry about on first glance – the visitor can’t see the image name unless they view it in a new page and look at the URL, or perhaps download it. When you’re using a lot of images, it’d save you a lot of time if you just kept all the file names as they arrive, either from a camera or stock website. But saving time isn’t the goal, here. In this case, the goal is SEO.
Search engines don’t just rank your website based on the text in the content, but also the file names of your images. That means you could have the most descriptive, keyword-rich content ever written, but if your images aren’t labelled appropriately, your site still won’t be meeting its full potential. All the images on your site should be labelled appropriately for the website and the image itself. If your site is for a construction equipment rental company, a picture of a trench rammer could be renamed something like ‘construction-rental-trench-rammer-280mm-Foot’, which would work better than the camera default, ‘IMG_1294.jpg’ (or whatever).
Alt Tagging
Optimisation goes even deeper with alt tagging. An alt tag is the text alternative to an image on a website. It’s what is displayed when an image fails to render in the browser and – depending on your browser settings – is also the text that comes up when you hover your mouse over an image. Like file names, search engines use alt tags in their analysis to determine your Search Engine Results Page (SERP) ranking. Alt tags are also a factor in deciding the position of an image in a Google Images search.
Be wary, though, because if you over-alt tag, it could hinder your SEO rating due to over-optimisation. Over-alt tagging, in this case, means filling your alt tags with text and keywords and adding more unnecessarily to decorative images (i.e. backgrounds, buttons, borders etc.). An ideal alt tag will concisely describe what is in the picture, with maybe a model or serial number if the image featured is an item that’s for sale. There’s no need for keywords like ‘sale’ or ‘cheap’. Sensible and dedicated alt tagging for all your relevant images might be a big job, but it could be just what your website SEO needs.
Image Sitemaps
Image sitemaps are what help Google add your images to its Google Images directory. When Google analyses a site (using what it calls ‘web crawlers’) to collect data, it can’t ‘crawl’ images that are not called out on the website source code. To be found by Google, images need to be on an image sitemap, which is how it receives metadata regarding the images contained on a website. If you use Google Sitemap extension for images, you can provide additional information about your images. By including your website’s images Google Sitemap, the search engine has access to the image title, geographic location, subject matter, caption, license, and the file type (JPG, PNG etc.). This makes it more likely that your images will be indexed by Google images and helps with your SEO.
Optimising images is a tricky, but essential, part of web development. Without knowledge of how to do this, your site could suffer both in UX and SEO. The best solution is to get in touch with experienced professionals who understand the ins and outs of UX, SEO, and all things web design/development. Whaddayaknowit, that’s just what we are! If you have any questions about what you’ve read, please feel free to get in touch via our contact page.
Image by Jakob Owens
Share.
- SEO.