Page 1 of 1

How to write a good alternative description (ALT) for an image?

Posted: Mon Dec 23, 2024 10:26 am
by mostakimvip06
The ALT attribute is also called "alternative text", "ALT tag" or (as in the Google Webmasters Guide) "descriptive alternate text". This is the text that appears when we can't see a graphic, photo or image for some reason (e.g. it didn't load, it was blocked). The ALT attribute also helps screen readers describe images to visually impaired Internet users, and above all (and this is the most important thing for us) it allows search engines to better index and evaluate the site. The ALT tag looks like this in the code:
<img src="image-name.gif" alt="Place alternative text here">
Why do you need to add texts in the ALT tag?
Let's imagine that we have placed a text on our travel blog about our last expedition, for example, to the Table Mountains. The text about the trip to Błędne Skały, climbing Szczeliniec Wielki, we have of course decorated with a whole bunch of beautiful and attractive photographs. Due to the fact that there were quite a lot of these photographs, we did not feel like changing the names of the photos and they all have a format straight from the camera, i.e. IMG_23495848.jpg. I will not mention the fact that such a thing should not happen. Whether we want to or not, we are never allowed to upload photos in such a format, but...

In our hypothetical story, we are lazy and as a result, there are a lot of photo files on the site that only have numbers instead of names. And the code format is standard

<img src="IMG 23495848.jpg">
Now let's imagine that our website is visited by a Google bot and it scans the text about the Stołowe Mountains. I would really like to index our photos, but it has no idea what is in these photos. Numbers and figures mean nothing to it. Of course, it can "roughly" assign a photo to a given category based on the context of the website, but it gets lost in more specific phrases.

How does it look in practice? If the text is titled, for example, "Góry Stołowe na weekend" then Google bot assumes that the photos in this article are about Góry Stołowe, but it will not know that in this photo there are Błędne Skały and in another Szczeliniec Wielki. Unless we tell it about it.

This is where the ALT attribute is necessary.

Image alt text (ALT) helps search engines associate images with the content of a web page so they can properly index them in search results . ALT tags also help search engines determine the best results to serve when a user searches for images related to a specific phrase. This is where it gets interesting.

Images in Google search results for table mountains
How does ALT text help us with SEO?
Despite the fact that text dominates search results, Google is also paying more and more attention to other forms such as images, graphics, and videos. The phrase search results are becoming more and more visually architects email addresses appealing, and Google is trying to suggest the most valuable answers to our questions in various forms. In these results, images play a special role.
Notice that images appear very often in search engine queries. They are located in different places, above and below text results or the map. However, they are always "somewhere".

This means that graphics are one of the elements that will help us increase organic traffic. If we did not appear in the text results, there is always a chance that we will appear in the graphics results. For this reason, it is worth investing in good photo descriptions. This is especially important in industries where the visual side prevails, e.g. the wedding photography industry.

Below are the different locations of images in search results.




How to write good alt text for an image?
It seems like a simple matter. You just have to describe what is in the image. Nothing difficult. Hmmm… So let's take a look at what Google itself has to say about alt texts.

According to Google, alt text should be “short but meaningful.” Well, that doesn’t tell us much, so let’s dig deeper. Elsewhere, we read that the ALT attribute should be: “useful, informative, contain relevant keywords, and relevant to the page’s content.”

In other words, we need to write it in such a way that we can fit a maximum amount of data into this small format. And at the same time, it can't look unnatural, but it would be good if we could also fit some keywords in there. In addition, it all has to fit into the context and theme of the page. "Is there a pilot flying with us?"

Another explanation related to writing ALTs definitely makes more sense to me.

ALT tags should provide enough information for people who can't see images to understand what the image is showing. For this reason, when writing ALT tags, it's worth asking yourself: if someone who is visually impaired heard this, would they be able to visualize the image's content?

EXAMPLE
a. ALT tag text that is not descriptive enough for this image:

<img src="spacer-nad-baltykuem.jpg" alt="Father and daughter">
b.Text in the ALT tag that is too long for this image.

<img src="spacer-nad-baltykuem.jpg" alt="A girl in a pink sweatshirt, with her hair tied in a ponytail, is holding her father's hand with a backpack. They are standing on the beach, by the sea, barefoot, and the water is washing their feet.">
b. ALT tag text that accurately describes the image content.

<img src="spacer-nad-baltykuem.jpg" alt="Dad and little daughter walking barefoot on the beach">
When writing a good ALT, we must also consider the context of the page. This ALT description would be good if the photo was on a page that wrote, for example, about family trips to the seaside in general. And what if the same photo was on my personal blog, which talked about a trip to the Baltic Sea?

Then the correct ALT might look like this:

<img src="spacer-nad-baltykuem.jpg" alt="Husband and 3-year-old daughter Ola walk barefoot on the beach on the Baltic Sea in Ustroń.">
The alt text for an image must be specific, but also representative of the subject of the page. The same image can be described differently depending on the page it is on.


How long should ALT text for an image be?
As you already know, ALT texts must not only be descriptive, but also short. Google does not provide a limit on the number of characters that should be in tags, but we can guess the limit. The most popular screen readers cut off ALT text after about 125 characters. It is advisable for the alt text to be limited to this number. In these 125 characters, we should provide users and search engines with enough detail to be able to link the image to the context of the page.
What is an empty ALT attribute?
Empty, meaning we haven't added it to the page. Then the image code looks like this.
<img src="IMG 23495848.jpg" alt=" ">
If you have a lot of such empty ALT attributes on your website, it is best to start filling them in right away.

Some good tips for writing ALTs.
Finally, let’s gather the best practices for writing ALT descriptions for images on a website.

1. Describe the graphic as thoroughly and specifically as possible.
The description should include all the key elements that will allow robots (and visually impaired people) to understand the subject of the image. Don't forget to adapt the description to the context of the page.
2. Don't put your keyword in every alt description.
The keyword doesn't have to be in the alt text of every image. Choose the image that you think is most representative of the topic and assign it a keyword.
3. Get rid of words that are unnecessary.
And such words and structures are, for example, "in this picture", "the photograph shows". Get straight to the point of the content. Everyone can see what a horse is like. The Google robot knows that it is dealing with a photo, picture or graphic. Don't waste characters writing about the obvious.
4. Use keywords in your ALT description.
The alt description is a great place to signal to search engines the keywords you want. If possible, weave the keyword phrase into the alt description. Remember, however, that the alt description should look natural and be descriptive. That's why…