Table of Contents
The discipline of SEO, the optimisation of web content for search engines, includes many aspects: Technical SEO, on page, off page, site structure, backlinks and much more.
One of the perhaps most underestimated aspects is the treatment to be given to images, the so-called image SEO.
The right images make articles more engaging and easier to read, adding context for both users and search engines, not to mention that image search is becoming more common and can be a gateway to visits that wouldn't come otherwise.
In order to improve the SEO of his website a webmaster should follow some good practices, also endorsed by Google, as it is stated in the Google Search Central image guidelines.
Let’s look at the steps to take one by one.
Use a descriptive file name
Image-related SEO starts with the name of the files. The name of the image files should reflect the content of the image itself. You should make sure that the names of the images are accurate and descriptive.
If the image accompanying the text is related to one of the keywords in the article, you should include the keywords in the image name. This will help search engines find your website when someone searches for something related to your image.
For example, in an article about classic Japanese motorcycles where you have included a photo of a Kawasaki 900 Z1, name the file kawasaki-900-z1.jpg or moto-kawasaki-900-z1.jpg.
Translating image file names
In the case of multilingual sites, all image file names must be localised, i.e. translated and adapted to the language of the page.
For example, if you have an image file representing a jumping horse, you should call it cavallo-che-salta.jpg on the Italian site, caballo-que-salta.jpg on the Spanish site, and jumping-horse.jpg on the English site.
As far as we know, there is no tool for convenient automatic or manual translation of image file names. For this reason we have developed a program available on Github: with little originality, is called Qabiria’s Image File Translator.
For the moment it is a preliminary version, written in Python and distributed under the GNU GPL v3.0 license: anyone can use, modify, and distribute the code, as long as they keep the same license.
The program runs from the command line and assumes that Python 3 is installed on the computer on which it is run. It works like this:
- you indicate the source language
- you indicate the language in which to translate the file names
- you indicate the root folder where the image files are located
- at that point the program duplicates all image files, automatically translating their names
Please note: it is only a program skeleton, though it’s working, that can be used as a basis for further development. We are not liable for any damage or loss of data caused by the use of the program.
Choosing the correct image format
Another factor to take into account that has an impact on SEO is the format of the image files. The most common formats for images are:
- JPEG for raster/bitmap images (photographs)
- PNG for images where you need to preserve transparency or with uniform colour fields
- SVG for logos or icons
Recently, new formats have been introduced, such as WebP and AVIF, with which you get smaller images with higher quality than JPEG and PNG.
The only disadvantage of these formats is that not all browsers support them. The percentage of users using browsers without support for WebP is less than 5%, as can be seen at CanIuse.com, while for AVIF format it is still over 30%.
If you decide not to use WebP you should choose the most suitable format for each type of image and, above all, optimise them.
Optimising images to increase speed
Using images that are larger than necessary has a negative impact on page loading speed.
Remember to resize images according to how you will use them: if you need a small image, 200 x 200 pixels for example, it is useless to upload a larger image and then resize it via CSS. Uploads the 200 x 200 pixel image directly.
To reduce page loading times all images must be compressed, or rather their weight must be reduced. There are many tools that help you optimise your images: websites (such as TinyPNG), plugins for popular CMSs (Smush for WordPress), cloud services that perform optimisation on the fly (such as Kraken.io), and even desktop programs (such as ImageOptim). All of these tools compress an image while maintaining the highest possible quality.
Using images that fit the user’s device
All SEO experts recommend creating different versions of the same image and serving the most appropriate one depending on the device and thus the user’s screen resolution.
It is counterproductive to display a large image on smaller screens, as it wastes bandwidth and slows down loading. The problem is particularly felt by mobile device users.
The solution is to use adaptive (responsive) images via the srcset attribute of HTML. To learn more, we refer you to the "Responsive images" page of MDN Web Docs.
Do not embed text in images
Each and every website development guideline insists on not creating images that contain text. This habit, a legacy of a certain way of formatting sites widespread in the last century, prevents not only search engines from automatically detecting text, but also users using screen readers from recognising those parts of text.
Beware of text contained in images in the following cases:
- images used as titles
- diagrams
- infographics
- screenshots of programs
If you can’t convert the image text with an OCR system beforehand and thus separate the text from the graphics, you should at least put the text at the bottom of the image.
Adding the alt attribute
The alt attribute of an image (sometimes called the "alt tag", although it is not a tag, but an attribute of the img tag) allows you to add a textual description to images. This is especially important for both accessibility and SEO.
The alt attribute is used by screen readers and any tool that automatically "reads" a web page. Providing an accurate description of the image aids indexing and helps those who cannot view the images for one reason or another (disability, use of outdated browsers or devices, disabled image display, etc.)
Using a sitemap for images
In addition to the sitemap, which indicates which pages make up a website, you can also have an image sitemap, which lists all of its images. Having a sitemap for your images increases the chance that your images will be found in Google Image searches.
At the same time, it tells Google which images to index, including those that might not be reachable by the bot, for example images embedded in Javascript code or similar.
Using a proper file structure
Google also suggests creating a proper URL structure for image files. It means that the way you structure and store images on your site should be logical, e.g., by creating a hierarchy of categories and, again, using descriptive names.
When it comes to SEO, "it all adds up." There is no single action that has a substantial impact on the positioning of a site, but it is the sum of many small interventions that produces - in the long run - good results. Paying attention to images is one such action.
To improve your site’s ranking follow the guidelines given and, if you have a site in multiple languages, use the program we provide for free to translate image file names.
If you need help, contact us for a non-binding quote.
