John Mueller and Lizzi Sassman of Google discuss creating alt text for an image that is good for screen reader users, briefly about what to do with decorative images and how difficult it is to write alt text that strikes a balance between SEO and accessibility.
Alt Text is For Accessibility & SEO?
According to the World Wide Web Consortium (commonly referred to as W3C), the official body for HTML standards, the purpose of Image Alt Text is to make images understandable to site visitors who cannot view image content and use screen readers.
Alt text also helps people who use screen readers understand the purpose of an image or read text in an image.
The W3C also claims that alt text is also used for SEO.
“… if you want your site to be indexed as well as it deserves, use the alt attribute to make sure it doesn’t miss important sections of your pages.”
It can be said that the purpose of alt text is to make images understandable and accessible to those who cannot see the image, including search engine bots.
Correct alt text requires a surprising amount of thought. The W3C has published an alt text tutorial for seven different types of graphical contexts.
Don’t Say an Image is an Image
While SEO may require the screenshot alt text to say that the image is a screenshot, for accessibility reasons it is considered redundant (and it is annoying to say that the image is an image).
Lizz Sassman and John Mueller discuss a solution to this problem:
“So one of the best practices is not to start every image with a screenshot, a screenshot, because then it just becomes repetitive.
We already know it’s a picture. You don’t have to say, “It’s a picture,” then a thing.
Just start with whatever description you want. I also think that it does not necessarily have to be a complete sentence.
Lizzi Sassman: It could just be a descriptive phrase. I don’t think it has to be a complete thought.
Balancing SEO Needs With Accessibility
John Mueller introduces a thread of tension between traditional SEO practice for Image Alt Text and accessibility requirements.
John Mueller: Yes, yes. I think it makes sense.
My point is that the hardest part is probably balancing the two sides. Type of accessibility aspect. What people expect from Alt Text for Accessibility.
And then the SEO aspect where you would be doing a few things, such as… traditionally, you would be doing a few things that might be slightly different.
As if you would mention a few synonyms, for example.
For example: “Oh, that ocean beach with waves.”
And this is the kind of thing where it sometimes makes sense to do it in an alt text for SEO reasons, but probably not for accessibility reasons.
And finding that balance is sometimes a bit difficult.
So it’s good to be careful about that.
Something is Better than Nothing
An important point about image alt text is that it is a bad practice to leave the alt text box blank.
One of the reasons this is a bad practice is that screen readers may start reading the image filenames, which is a negative user experience.
Another reason is that it deprives visitors who use screen readers of the ability to receive important information that may be in some images.
Next, there are SEO considerations for alt text and getting your images properly indexed and found in a search engine.
John Mueller recommends adding something to alt text because something is better than nothing.
John Mueller: But if you’re just adding alt text the first time, sometimes even arbitrary alt text is better than nothing.
At least start with something, but then what can you do to improve something else. “
Alt Text and Decorative Images
Lizzi Sassman then discussed what to do with decorative paintings.
The first problem is to distinguish whether the image is really decorative or whether it is conceptual and contributes to the meaning of the content. In this case, the challenge is how to convey the conceptual image.
“And that’s definitely something that … I think I struggle with more, such as how you find yourself hitting decorative paintings more often or things that aren’t …
I don’t know… the search result is quite simple.
But when it goes into things like, “Oh, that’s a concept,” or like, “It’s decorative,” so no …
There are places that say, “Oh, you don’t have to put alt text in a decorative image.”
For example, if it’s just for aesthetics, it’s better to just leave the alt text blank.
But then again, why would I put it there? There was a reason to put it there.
So shouldn’t we have something to fill this gap for the experience of someone who cannot see the picture?
Shouldn’t we have a replacement? It served a purpose.
We put it there for a reason, such as what would be an alternate experience to keep giving this information, I suppose?
So like Googlebot, like doing stuff.
Sometimes we have those that I think would qualify as a decorative painting.
It’s like Googlebot is browsing the internet or something.
Or is it conveying an idea and should the alt text focus on that idea? Or like, “Oh, that’s Googlebot with friends.”
Or it’s Googlebot… like dumping spam on your computer and then being happy in the end.
How describing what’s going on there in order to still sort of get an idea of what was supposed to be there is, I think, one of the things that… yes, it confuses me.
John Mueller: Yes. I mean, from a personal point of view, I would definitely add alternative text to these kinds of images as they are unique and special.
It’s not … I don’t know … a floral background or something.
It is actually something that people spent a lot of time creating this image.
It’s also something people might want to find in search results.
So if you’re looking for a Googlebot, as we spend so much time creating all these images, it’ll be nice to be able to find them as well.
The W3C has published a full page of documentation on how to deal with alt text for decorative images.
Here is the official W3C recommendation:
“Decorative images do not add information to the content of the page.
For example, the information provided by the image may already be provided with adjacent text, or the image may be included to make the website more visually appealing.
In such cases, you must provide a blank (empty) alternative text (alt = “”) so that it can be ignored by assistive technology such as screen readers.
Text values for these types of images would make an audible mess on the screen reader output or could distract users if the topic differed from that in the adjacent text. “
The W3C also suggests four ways to identify decorative images.
Four tests to see if an image is decorative:
Ultimately, it is up to the author to determine what is best for the text of the alternate image.
As Google said, something is better than nothing. So if the image does not provide information, just use null for alternative text that is encoded with alt = “”
Citation
Listen to this part of the Google podcast at 3:17 PM:
Featured photo: Shutterstock / Roman Samborskyi