Images are an important part of most websites, but to make sure that the information conveyed through those images is not lost on those with low vision or blindness, it’s important to add “alt text” to them. This is basically a line of text which explains to users who can’t see your image what is conveyed by that image and why it’s part of the postIn most cases, this is probably similar to what a caption for the image might look like, but in some cases might just let people know that an image has no particular relevance to the message other than decoration.

How to add alt text to images on Facebook or Twitter

What should be in my alt text?

Alt text should essentially tell someone the context of an image and any specific information conveyed. It should NOT concentrate on describing the visual elements of the image, unless these are critical to the message you’re trying to deliver.

  • Stuff to include in your alt text
    Where the image links to
    Text that is embedded in the image
    what’s in the image, if it relates to the theme of the page or post
  • What should NOT be part of your alt text
    Purely visual aspects, like the color clothing someone is wearing, unless it’s relevant to the message of the page or post
    The word “image” or “photo”; your visitor already knows it’s an image
    The filename of the image, unless the filename is important to the message.

NOTE: If your image is purely decorative, and doesn’t convey any special information, you can either just put the word “decorative” as the alt text, so your visitors know they aren’t missing anything, or use an empty alt value. (Sometimes if you leave the alt value empty, a site will remove it altogether, which doesn’t have the same effect. If in doubt, consider putting the word “decorative” as the alt text.)

More Information

For more information on accessibility including more examples and discussion of alt text, color contrast and other topics, please see the WFU Accessibility website and the Accessible Content Working Group website.

Categories: Accessibility

Recent Posts

Archives