Pictures and Alt Text

Website Accessibility

All images (and most media such as videos) must have an “Alt Tag,” which is a short text description of the image. When using the Main Image from the Edit Page screen, the Alt Tag is the only element you need to worry about besides the image itself.

Main Image Screen

When placing or editing an image within a XHTML element (the advanced image editing tool), you need to put the description in the “Image Description” field. In fact, if you do not put a description in, the CMS will give you a warning.

The length of the alt tag should be short enough to describe what the image is trying to convey in the shortest way possible. For example, if you are showing a head-shot of a person, your Alt Text will probably be the person's name. So "Kevin Murphy" would be appropriate. What is too long is "Kevin Murphy standing on the beach in Hawaii while on vacation in 2007". Most of that information is not necessary for conveying what the picture is about.

A good rule of thumb would be to try to imagine conveying the information from a web page over the phone to someone. How do you describe the picture you come across to that person over the phone in as short of way possible.

Images with Purpose

An exception to this rule is images that serve a purpose, such as a buttons or other links, you can use the link information instead. For example, the following is a content block for our website. In this case the description of "Students in a Classroom" wouldn't be incorrect, but a better alternate text would be "Curriculum", since the image serves as a button to take you to the curriculum page on the site.

Curriculum Content Block