University of West Florida

Academic Technology Center

 

AskATC

The AskATC knowledge base has been created to answer your questions about designing, developing, implementing, and teaching online courses.

Need help with your course?

Contact Our Instructional Designers:

Cindy Mersereau:
E-mail: cmersereau@uwf.edu
Phone: 850-474-3291

June Watkins:
E-mail: jwatkins1@uwf.edu
Phone: 850-474-3165

Lior Flum:
E-mail: lflum@uwf.edu
Phone: 850-473-7239

Alternative Text (ALT TXT)

Providing alternative text (ALT Text) is one of the easiest accommodations to provide, but unfortunately, it is either missing or inadequate on most pages. Alternative text is used to provide a textual alternative to images, media, applets, and any other non-text content. The focus here will be on images, graphs, charts, and a briefly on videos.

ALT Text Basics

Alt text provides:

  • Information read by screen readers to provide both description and context for visual or cognitive disabilities.
  • Information for browsers that don't support the image display or when the user has images turned off.
  • Semantic meaning and description that can be read by search engines.

Screen readers and search engines cannot analyze images, graphs, etc. to determine content and function. This is the information that the alternative text must provide and can be done in two ways:

  • Within the Alt attribute of the image tag, graph, etc.
  • Within the text that surrounds the image, graph, etc.

The description should be clear, but succinct. If it cannot be succinct, then another linked page from longdesc attribute (long description) is used.

Context

It is important to consider the context of the page when writing the Alt text. For example, the same photo of Pensacola Beach would have two different Alt attributes depending on whether it was used on a tourist web site, or with an article on the BP oil spill.

  • Every image must have an Alt attribute. If the image is truly decorative it may be given an empty or null Alt attribute (e.g., Alt="").
  • Be accurate and equivalent. Remember to represent both content and function if need be.
  • Be succinct. Typically a few words suffice, but a short sentence or two may be necessary for clarity.
  • DO NOT be redundant. If the same information is available in the surrounding text, then the null attribute is sufficient. However, it is best to err on the side of more information rather than less.
  • DO NOT use phrases such as "image of...:, "graphic of...". Convey the information. It is not necessary to indicate that the information is from an image or graphic.

Charts

Charts, graphs and maps use visuals to convey complex images to users. But since they are images, these media provide serious accessibility issues to colorblind users and users of screen readers.

  • If the data in a chart, graph or map is important to the page content, you must provide a text description of the image, or a data table replicating the chart data.
  • Supplement color-coded charts with texture, different line styles, or distinct shades of color. Charts should be readable in black and white (grey scale).
  • Don't convert data tables into images, use the data table itself.
Academic Technology Center | Building 77 Room 138| 11000 University Pkwy. | Pensacola, FL 32514 | (850) 474-2056 | 1.888.529.1823 | 850.474.2807 (Fax) | atc@uwf.edu | Campus Map | Text Only