Wikipedia:Manual of Style/Accessibility/Alternative text for images

Every time a Wikipedia article uses an image, the alternate text for that image should be specified. Alternate text is used as a replacement for an image, whenever the image cannot be seen. This can happen, for example, when someone:

uses a speech browser (e.g. a visually impaired person)
uses a text-only browser (e.g. browsing from a mobile phone)
uses a graphical browser with images turned off
has not yet downloaded the image
browses results from a Web search
copies an extract from a Web page into a word processor.

Alternate text is also used in other circumstances: for example, google's image search uses it to help return appropriate images. Finally, good choice of alternate text and captions makes life easier for people who are viewing the source of an article, either when editing it, or in a diff, or in Wikipedia's internal search.

You can use [[Image:source-of-image|alternate text goes here]] to specify alternate text. Unfortunately, most Web authors - even those who know what alternate text is intended for - have trouble writing appropriate alternate text. This is a guide to getting it right.

Imagine you're writing for an audio cassette

A helpful way to think about alternate text is to imagine that the Web page text, including all alternate text, is the script for an audio cassette. Your listeners aren't necessarily blind, so they may be interested in hearing about what something looks like. But they can't possibly see any images on the cassette, and they never will, so referring to an image itself will sound silly. If you write your alternate text with this in mind, it should work well in all the situations listed above.

The best alternate text is often nothing

In Wikipedia, images tend to be fairly important. Often, however, an image's meaning won't be important enough to merit inclusion in a text-only rendering of the page. This is especially true when the image is merely a visual equivalent to something already in the page's text. So empty alternate text is often the best choice.

Note: In the current version of the Wikipedia software, you cannot provide completely empty alternate space, so instead use a single space: [[Image:source-of-image| ]].

For a vital image, express its meaning

If an image is an important and unique part of what you are trying to say, provide alternate text which, if possible, makes the page as understandable and useful for people who can't see the image as for people who can.

Use appropriate punctuation to make your alternate text sound sensible. With the current version of the Wikipedia software, alternate text for images should form one or more complete sentences. Don't forget to start them with a capital letter, finish them with a full stop, and include a verb.

Example

Wikipedia code

1... e5 [[image:chess_sg_b1.png|Black's pawn is brought out immediately in front of White's one.]] This move by Black is good, for the same reasons as White's was. Note that the two e-file pawns are not threatening to capture each other, because pawns capture diagonally.

Note in particular the phrase "Black's pawn is brought out immediately in front of White's one." This is the text that will be rendered in place of the image.

What people see

1... e5

Black's pawn is brought out immediately in front of White's one.
This move for Black is good, for the same reasons as White's was. Note that the two e-file pawns are not threatening to capture each other, because pawns capture diagonally.

The above might be displayed in a graphical web browser that is capable of showing images. In this case, the image serves to illustrate the chess move.

What people see with images turned off

1... e5

Black's pawn is brought out immediately in front of White's one.

This move for Black is good, for the same reasons as White's was.
Note that the two e-file pawns are not threatening to capture each other, because pawns capture diagonally.

This example shows what might be displayed in a web browser with images turned off. Many modern browsers allow users to turn off images (for example, if they are using a low-bandwidth connection). The contents of the alt text are often rendered in place of the image. Here, the phrase serves as a useful replacement for the image.

Caveat: Though this is not technically considered an appropriate usage for the alt text contents, many browsers nevertheless display it in this manner. If possible, choose alt text which makes sense in this format.

What people hear

"1... e5. Black's pawn is brought out immediately in front of White's one. This move for Black is good, for the same reasons as White's was. Note that the two e-file pawns are not threatening to capture each other, because pawns capture diagonally."

The above text may be spoken by a screen reader or aural browser. Again, the alt contents provide a useful replacement for the image, and conveys similar information.

Don't talk about the image, talk about the thing

A common mistake in writing alternate text is to describe the image itself. Your listeners don't care that you put an image in the visual version of the page. Instead, they want to hear what you were trying to convey by putting it there.

Example
	Don't do this	Do this instead
Wikipedia code	`[[Image:Salinas iceberg lettuce thumbnail.jpg\|Salinas iceberg lettuce thumbnail]] A lettuce plant has a short stem initially, but when it blooms, the stem lengthens and branches, and it produces many flower heads that look like those of dandelions, but smaller.`	`[[Image:Salinas iceberg lettuce thumbnail.jpg\|Most lettuce varieties take the form of a round mass of broad green leaves, with wrinkled edges.]] A lettuce plant has a short stem initially, but when it blooms, the stem lengthens and branches, and it produces many flower heads that look like those of dandelions, but smaller.`
What people hear	"Salinas iceberg lettuce thumbnail. A lettuce plant has a short stem initially, but when it blooms, the stem lengthens and branches, and it produces many flower heads that look like those of dandelions, but smaller."	"Most lettuce varieties take the form of a round mass of broad green leaves, with wrinkled edges. A lettuce plant has a short stem initially, but when it blooms, the stem lengthens and branches, and it produces many flower heads that look like those of dandelions, but smaller."

Don't talk about the file, talk about the thing

When writing alternate text, assume that your readers don't have any access to the image, and never will. That will help you avoid frustrating people who really can't see it.

This means you shouldn't mention any of the following in alternate text:

the filename
the size of the file
the dimensions of the file
the filetype
instructions on how to view a bigger version of the image (which will be similarly inaccessible).

Note: If you do not provide any alternate text, the Wikipedia software currently defaults to the image's filename. To work around this problem, always supply alternate text yourself.

Same image, different articles, different alternate text

The most appropriate alternate text for an image depends on its context:

whether it is vital to the meaning of that particular page
where it is inserted, relative to the rest of the text
whether there are other images on the page which better demonstrate particular details.

So the same image may have different alternate text in different articles.

Need more help?

If you're still unsure about the best alternate text for an image, leave a note on this article's talk page, and someone will help you out.

External links

Use the alt attribute [World Wide Web Consortium]
Alan Flavell's ALT text primer
W3C Web Content Accessibility Guidelines 1.0, section on ALT text