click to play button
click to replay button
ALTTagVideo.mp4
X
    00:00 / 00:00
    CC
    In this video, I am going to explain how to provide the most accessible graphics using ALT tags. Screen readers use ALT tags to describe images and their functionality. The first thing to consider when creating Alt tags is why the image is presented on the page. Is it there to provide instructions or simply for decoration? Take, for example, this picture of two different types of credit cards accepted and its two possible ALT tags. The first ALT tag, which only reads “Credit Card Logos," is not sufficient in describing the image. More questions are created than answered. Since the image displays vital information pertaining to the types of payment accepted, it would be better to go with the second ALT tag, reading “Vidi-Visi and Magic Card accepted.” There are other types of images such as this example. This picture of the dome of the U.S. Capitol can have different ALT tags depending on the context in which the image is used. The simplest ALT tag for this image would read “Capitol Building” or “the Dome of the U.S. Capitol Building”. these tags would suffice in most news or political science articles. However, if the image surfaced in an architecture context, a longer, more descriptive ALT tag would be necessary to describe the Neoclassical style archtecture. Images can also be links, like this picture of George Washington. The ALT attribute must describe the function of the link. A simple ALT tag reading “George Washington”, would not suffice in this case. A more accurate ALT tag reading, “Wikipedia entry for George Washington”, would better suit this image link. Any image that does not contribute any information, such as the horizontal seperator shown here,is considered a decorative image. Even though they do not contribute anything to the page, they still need an ALT tag. The ALT tag for the images can simply be a blank space. That way screen readers do not only read “IMAGE” or the complicated filename from which it was taken. They simply skip over the image. Conciseness is highly recommended when it comes to ALT tags. It is recommended to keep ALT tags 150 characters or less. Some images, however, may need a longer description. If this is the case you can include a link to a separate description of the image. Perhaps a more effective way would be to include the bulk of the information in the text. That way all users can benefit from it, not just those who use screen readers. Also try to avoid using phrases like, “image of…” or “graphic of…” as well as redundancy. ALT tags that are word for word with the surrounding text are a waste of the user’s time. Hope this video helps. Thanks for watching!