Providing Alternate Text for Your Images

posted by Kravvitz at 8:48 PM on Apr. 26th, 2009

Categories: HTML, Semantics, Web Images 5 comments

In short, if an image contains significant text, that text should be used as the alternate text. If the image is a photo, a drawing, a chart, or a map then a short description should be given of it. Otherwise the image probably should not have any alternate text. Perhaps a couple examples would help demonstrate what I mean.

Let's say you have a navbar and your client wants a specific font used in it. So you put an image in each link instead of just plain old text. The alternate text for each should simply be the text that is embedded in the image.

One incorrect usage that I see many people using is alternate text like "top right rounded corner". That is just plain wrong. If someone can't see an image of that kind they have no need to know it's there.

So please give some thought to how you provide alternate text for the images you include in the pages you create.

#1 Arem 11:34 PM on May. 6th, 2009

An admission: lately I often have not been including alt text with images. Examples include where the image is really just for decoration, or if the image is of an event that is being described in the text.

I know that's probably wrong, but I have a picture in mind of a blind user accessing the page. Does that user really need to know there is a picture of the event on the page? Isn't it just a pointless distraction?

Of course, the user may not be totally blind, in which case some alt text might help to clarify what's there... I don't know. I'd be interested in thoughts on this. Maybe I am overlooking many other uses of alt text.

#2 Kravvitz 9:41 PM on May. 7th, 2009

If it's just for decoration, it's probably best to give the alt attribute a blank value. However, if the image is just of something that the text is talking about, then it's really down to a judgment call on your part. Perhaps these related articles will help you:

#3 Arem 1:02 AM on May. 9th, 2009

Thanks for those links, Kravvitz. Very interesting. I should have added that in the situations I described, I've been using Code:

alt=""
(in other words, using a blank value), rather than leaving out alt altogether.

#4 EricReese 10:22 PM on May. 16th, 2009

Hi, first comment here..

I always add in the alt attribute just for validation on images such as rounded corners, and just images that add to the overall presentation of the site. Images that add content and/or value to the page in question, such as a logo, or say, a picture of a person doing an activity then I add the alt attribute with values in the quotes.

#5 TheCrow 1:01 PM on Sep. 13th, 2012

Hi just thought i would tell you some thing.. This is twice now i?ve ledand in your weblog in the final 3 weeks looking for completely unrelated issues. Terrific Data! Keep up the beneficial work.

Login or Register to post a comment