A lot has been written about how to write meaningful alt attribute description for image elements, for those who use screen readers or with a slow connection where images that won't load. There are ground rules for when to use add a description to an alt attribute versus an empty alt text attribute. What I haven't been able to find anywhere is if it is useful to include colors in an alt attribute description. Even the W3 developer guidelines and WebAIM don't mention color in alt attribute descriptions at all. I've been looking at many websites' image alt text, from bloggers to corporations, and Twitter users who take advantage of their relatively new alt text feature. Many times I have seen an image described as something like "Person in a red shirt reading a blue book." or "A huge green field under a bright blue sky."
If anyone has any insight, I would love to learn more to write the best alt attribute descriptions.
Top comments (6)
I use the same decision tree about color as I do age, gender and ethnicity: Is the image important because of one of those factors?
The comment about the red lake is a good example of that. We're showing the image because the lake is red and that's the notable thing we're trying to depict.
On a page for our university about diversity, we describe "A group of students from different cultural and ethnic backgrounds." It isn't relevant that there is one brown-skinned student, one student who appears to be Asian, etc. - not to mention those are "guesses" that could be wrong. The idea is we're illustrating a diverse student body.
Same with ages: An elderly woman looks at a young child matters if the content is about the effects of spending time with grandchildren on the health of older people; if it's just a story about Christmas traditions, the age may not be relevant.
And, because I have to throw it in anywhere I can: If nothing about your image matters, don't use the image. Design for design's sake is annoying whether you use assistive technology or not.
Thank you so much for your answer. Treating it like a decision tree really helps, and I really appreciate the examples you give!
I think it depends on the context for whether to include color. If the color is relevant to the content of the page and the image, then I think it makes sense. An example might be something that is unique like "A red lake" but for an ordinary lake saying "A blue lake" may be overdoing it.
I'm also not a viewer of alt tags when I'm browsing, but I would like to hear from someone who is. Do they prefer more descriptive alt tags or more basic? I could see how it might be dull to browse with alt tags being strictly nouns, but if that person has never seen color it may not provide benefit to them.
I agree, context is everything with alt text, and I like your idea of using color when the object is unique.
I'd like to hear from people who use a screen reader as part of their normal browsing process too. There's also the case where an image won't load due to slow connection, and I'm not sure how useful color would be in that scenario either.
If color is relevant to understanding the meaning of the image, it should absolutely be included. Irrelevant details make alt text difficult to use and confusing.
CC: @lkopacz @sublimemarch @alice