What's the right alt text to use? (alternative text)

For general web development questions that are not specifically related to CSS HTML Validator. This includes (but is not limited to) general HTML, CSS, Accessibility, JavaScript, and SEO questions.
Post Reply
User avatar
Albert Wiersch
Site Admin
Posts: 3783
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

What's the right alt text to use? (alternative text)

Post by Albert Wiersch »

I was reviewing the HTML5 specification and read sections regarding alternate text for images (using the "alt" attribute):
https://html.spec.whatwg.org/multipage/images.html#alt

It's not as easy as it might seem. There are cases when it should be an empty string, when it shouldn't, and when the "alt" attribute should be left out completely (rare).

I think it should also be stressed that "alt" text is replacement text for the image, not supplemental text, like what can be provided with the "title" attribute.

It should not repeat prose that is right next to it (in this case alt="" may be appropriate).

The "alt" attribute should only be omitted when no alternative text is available and none can be made available. Omitting the "alt" attribute is different than alt="", where the alternative text is an empty string.

There are good examples as well. I would suggest reviewing that section of the specification (4.8.1.1).

Also, keep in mind that using good alternative text may also help with SEO.
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
User avatar
MikeGale
Rank VI - Professional
Posts: 726
Joined: Mon Dec 13, 2004 1:50 pm
Location: Tannhauser Gate

Re: What's the right alt text to use? (alternative text)

Post by MikeGale »

Useful section.

Thanks.

I find that an empty alt string isn't that uncommon.

The suggestion that you put in there what you would say if you were "reading the page out" over the phone, seems like good advice to me.
User avatar
RSteinwand
Rank VI - Professional
Posts: 596
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: What's the right alt text to use? (alternative text)

Post by RSteinwand »

Looks like I've got some work to do. I always have an alt with images, but sometimes I've set it to alt="".
Rick
LadynRed
Rank 0 - Newcomer
Posts: 3
Joined: Fri Jun 04, 2010 10:37 am

Re: What's the right alt text to use? (alternative text)

Post by LadynRed »

User avatar
RSteinwand
Rank VI - Professional
Posts: 596
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: What's the right alt text to use? (alternative text)

Post by RSteinwand »

Yes, that is a good guide.
Rick
User avatar
RSteinwand
Rank VI - Professional
Posts: 596
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: What's the right alt text to use? (alternative text)

Post by RSteinwand »

My plan is to use a good description for alt and hope that bots are smart enough to take it from there.
Rick
User avatar
Albert Wiersch
Site Admin
Posts: 3783
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: What's the right alt text to use? (alternative text)

Post by Albert Wiersch »

I think the best thing you can do right now for SEO and alt tags is to write them first and foremost for human readers. Like Rick says, the bots, especially Google, are pretty smart these days and trying to "trick" them or write for them (bots) instead of for people will probably not get you anywhere and could even get you penalized. I think it has been this way for a few years now.
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
User avatar
Albert Wiersch
Site Admin
Posts: 3783
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: What's the right alt text to use? (alternative text)

Post by Albert Wiersch »

Writing great alt text when emotion matters by Jake Archibald

Here's a good article about alt text when emotion matters (and context too):
https://jakearchibald.com/2021/great-alt-text/
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
Post Reply