Which alt text is best for screen readers for example "smiling kid"?

Which would be good write ALT text for a photo of kid which is smiling and sitting in garden?

This

alt="Photo of smiling kid sitting in the garden"

or this

alt="Photo of smiling kid"

or this

alt="Smiling kid sitting in the garden"

or this

alt="Smiling kid"

my purpose is to ask this question, I want to know should we include "Photo of..." in every alt text and And how much we should 开发者_开发百科describe the photo in alt text.

It depends on the context but make it as short as possible without leaving out important information. As a screen reader user I like short alt text that gets to the point so I don't have to listen to lots of pointless descriptions. alt="Photo of smiling kid” is too long. Jaws announces the fact that it’s reading a graphic so alt=”smiling kid” would be better since it saves two words I don’t have to listen to. Only put information that is important in the alt tag. For example if the fact that the kid is in a garden isn’t important don’t put it in the alt tag. If the fact that the kid is in a garden is critical information that the reader must know then put it in the alt tag.

As a rule of thumb, the alt text should be what you would say if you were reading the page out to somebody over the 'phone.

A picture is worth one thousand words, but only some of those words are important in context. The same image will have different alternative content depending on the context it is used in. For example, on a photo gallery site, the image is the primary content, and a description of the image would be appropriate. The same image used to create a mood on an article, doesn't contribute any actual content so alt="" would be better.

Test your webpages using Lynx, it is a very good way to seeing if you need to change alt text because it isn't conveying everything you need to convey or doesn't make sense in context.

The late, great Alan Flavell wrote an excellent article on the subject which I consider essential reading.

Why not follow the standards? WCAG 2.0 guideline "1.1.1 Non-text Content" says that for content (e.g. images) that are used for decorative or formatting purposes then they should be implemented in a way that assistive technology (e.g. screen readers) can ignore it. If the "smiling kid" is decorative, then use an empty alt="" attribute.

http://www.w3.org/WAI/WCAG20/quickref/#text-equiv-all

It's really here nor there. The alt text should describe what the image shows, and will likely be supported by text on the page, but what level of detail you go to is down to you to decide.