What is good alt text to use?

rubyslayer42889 · March 9, 2018, 3:24am

Question

For step 1 of this exercise, is “A photo of a brown bear’s head” good alt text to use?

Answer

This text certainly is descriptive and you are off to a great start here! With few exceptions, we generally want to avoid phrases like “photo of…”, “graphic of …”, “image of …” with our alt attributes as this information is usually redundant. I would recommend the more concise yet sufficiently descriptive alt value of “Brown Bear”.

For more information on how to create great alternative text, take a look at these examples.

seyyid.king · August 19, 2018, 7:24am

Why doesn’t the alt text display itself along with the image? How do we make the text accompanying the image visible for a normal web reader?

mtf · August 23, 2018, 5:10am

Start here…

https://www.w3.org/WAI/

Track down what the real use of alternate text is. It is important to not abuse it for SEO purposes or leverage it for marketing purposes. Let it be a concern of well-formedness rather than the bottom line.

Until one understands the need for accessibility, all the remaining explanations are meaningless. Why even use the alt="" attribute? Just for show?

Alternate text is meant for people and user agents who/which literally cannot see. Blind people are blind. So too are search robots. Search engines are blind and use the data surrounding an image to give it some idea of how to index the image. The alternate text is the most specific since it is in the same tag as the src attribute. They must be connected is how a search engine will see it.

To a blind person, the alternate text does its best to describe the picture that the sighted user can see, in a brief phrase. The user will be able to browse the page and come across a descripton of an image then continue reading. If that description fits the context of what they are reading then it will be meaningfull and experiential. If not, well the experience could be less than pleasant and the page visit lost on the user. Accessibility means including everyone in the same relative experience.

wilfredoisaac5934801 · September 10, 2018, 11:20am

Excelente, bien explicado.

nbornstein · November 28, 2018, 3:46am

My alt text read “a brown bear looks off wistfully into the distance”

mtf · November 28, 2018, 4:43am

ALT text is objective, not subjective. We’re not writing or poem or narrating a drama. It is not the purpose of alternate text to denote tone or to emote, but to describe as simply as possible what is the principal object in the image.

burgerdessert · December 12, 2018, 8:03pm

My alt tag for this was “A very cute brown bear. It’s looking right at the camera. What are you doing? You need to get out of there! That’s a bear!”

Is that a good alt tag?

mtf · December 12, 2018, 8:32pm

No, it is far to subjective. ALT text must be explicit, concise and objective. We would only use adjectives that are critical, such as brown bear as opposed to black bear, etc. We would never narrate and only use verbs that are also critical to the objectivity. Eg. brown bear sitting on honches.

An unsighted person is not very likely to be standing that near to a dangerous wild animal. This is superfluous narration.

haxpotato · February 16, 2019, 3:46pm

he said it for fun .-.

jrocket90 · February 21, 2019, 6:12pm

not sure if i done something wrong or it sais its right but where does the description go

mtf · February 21, 2019, 6:46pm

The URL is not alternate text, but the src attribute value.

alt="Some text to describe the picture"

johanchng · March 9, 2019, 8:11pm

I think I have done what this task requires me to do, but I can’t see the Alternative text coming out. Is this normal or shall I be able to see the text? Thank you very much!

mtf · March 9, 2019, 9:07pm

Alternate text only displays while waiting for the image to download. Then it is hidden. MS browsers can see the text on mouseover (as a tooltip) but others do not (afaik). For those browsers we would put in an additional attribute, title="" which text will display as a tooltip in all browsers.

johanchng · March 16, 2019, 12:00pm

Thank you very much!

digital5179401554 · May 27, 2019, 9:17pm

why doesn’t my alt image text show on the screen?

mtf · May 27, 2019, 9:23pm

See the post above… ALT text does not display on mouseover in most browsers, only IE as far as I know. Edge may be different.

course0029984303 · June 3, 2019, 6:19pm

mtf:

Track down what the real use of alternate text is. It is important to not abuse it for SEO purposes or leverage it for marketing purposes. Let it be a concern of well-formedness rather than the bottom line.

Until one understands the need for accessibility, all the remaining explanations are meaningless. Why even use the alt="" attribute? Just for show?

Alternate text is meant for people and user agents who/which literally cannot see. Blind people are blind. So too are search robots. Search engines are blind and use the data surrounding an image to give it some idea of how to index the image. The alternate text is the most specific since it is in the same tag as the src attribute. They must be connected is how a search engine will see it.

To a blind person, the alternate text does its best to describe the picture that the sighted user can see, in a brief phrase. The user will be able to browse the page and come across a descripton of an image then continue reading. If that description fits the context of what they are reading then it will be meaningfull and experiential. If not, well the experience could be less than pleasant and the page visit lost on the user. Accessibility means including everyone in the same relative experience.

excellent man! keep it up

poddokujoshua1875474 · June 4, 2019, 9:00pm

In short I can say that, they are useful when the picture doesn’t load due to certain issues!
Instead of blank space in front of you, an alternative text would atleast give you some information about the content.

I’d like to show another example for ease.

HAPPY CODING!