They say a picture is worth a thousand words, and the same is true online. Images are an integral part of pretty much any website, whether they are symbols, illustrations or photos. They can tell a story. Getting the most out of your images will take a little bit of extra work. The good news is that optimising your images for SEO can increase your visibility in the image search results and attract more visitors to your site.
Humans can process images much faster than text. However, the big problem is that search engines can’t see images as humans do. They recognise the fact that there is an image, but they can’t tell what the image is about. At least not based on the image alone. Although search engines work very hard to find and index images, for best results, you need to help them out by providing key data.
Let’s taker a closer look at the image below. When crawling this webpage, Google’s crawling spider will see that there is an image here, because the webpage contains the <img> HTML tag. However, the only information provided within the tag is the image’s URL.
Humans will identify very easily that this is an image of penguins, but search engines do not. We can help them understand images by using relevant alt tags and file names. Let me show you how.
The alt-tag
Whenever an image can’t be displayed properly (e.g. due to a slow connection or a broken image), the alt tag will show an alternative text. This gives the user an idea of what kind of image they should be seeing. But it is equally important for search engines: the alt tag tells search engines what the image is about.
So if someone performs an image search, on Google for example, the search engine will match the words used in the alt tag against the user’s search query. Therefore, it is a good idea to use relevant keywords in the alt tag which describe the image.
Additionally, screenreaders, which are often used by visually impaired users, will use the alt tag to read it back to the user. Using alt tags correctly does not only increase your visibility in the search results, but will make your website more accessible, which is great for users. Google favours websites with a high accessibility, so this is a no-brainer.
I’d like to ask you to examine the code of the image above (right-click on the image > Inspect Element). You will see that I’ve added an alternative description with the alt-tag: <img … alt=”Giant Panda Eating Bamboo” … /> . With this alt tag we’re telling search engines that this is an image of a giant panda and that it’s currently snacking on bamboo. So if someone is searching for “giant panda bamboo” or something similar, chances are now higher that our image will appear in the results.
Adding alt tags is usually very easy, most CMS editors will let you enter an alternative description when you’re uploading or inserting an image.
The File Name
You can further optimise your images by changing the image’s file name. Very often, image names consist of a row of numbers, particularly when they’re uploaded from digital cameras, such as ‘DSC1234.jpg’. Since this file name isn’t very informative, it doesn’t tell search engines anything. Instead, we could be renaming the image to ‘green-bicycle.jpg’. Use hyphens to separate words, and avoid underscores (_) or plus symbols (+). Using hyphens will allow search engines to identify the individual words.
The Image File Size
Google favours websites with short loading times, because slow websites aren’t very user-friendly. So if your website is loading rather slowly, you may not be ranking as high as you could. Image file size is one of the elements which influence how long it takes for a website to fully load. Therefore, resizing your images may speed this process up.
You probably won’t see much of a difference if there are only a few images on a page, but the results for pages with dozens of images on them can be huge.
File size usually depends on the image’s resolution: the higher the resolution the larger the file size. This means you need to find the right balance between quality and file size. The three most commonly used image types on the internet are jpg, png, and gif. Each of them have their advantages in specific situations, so it’s impossible to say which one is the best per se.
- jpg allows for an adjustable degree of compression which discards little pieces that the eye is least likely to notice.
- png files support transparency (unlike jpg), and are a lossless alternative for the gif format.
- gif images are lossless for images with 256 colors or less, and also support animations.
Another very important thing that you should keep in mind is: don’t use HTML to change the image size. If you’re uploading a big image, and then define the height and width attributes via HTML, you will be wasting bandwidth. It is better to resize the image to the approximate size that you’ll need before uploading it.
Conclusion
Optimising your images can increase your visibility in the image search results and thus attract more visitors to your site. For some businesses this may be highly relevant and incredibly useful. Alt-attribute, file name and file size are the three most important factors when optimising images. The alternative text and file name should include relevant keywords, and the file size should be kept as small as possible to increase your website’s loading speed.
If you would like to know more about image optimisation for your website, get in touch and we’ll be happy to support you.
