This guide provides information on how to use and create alt text in TU’s academic,
online and business resources. This guide does not cover HTML alt text coding. If
you have questions about the use of the alt tag in HTML, please contact otsaccessibility AT_TOWSON
What is Alt Text?
Alt text, sometimes known as “alt attributes” or “alt descriptions,” is text (in HTML
or other written, electronic copy) used to convey the image’s content or function
to screen-reading software. Alt text is also used in place of an image in the event
of broken image links or insufficient bandwidth to load images. Alt text can help
to optimize your content for web image searches, although “stuffing” keywords into
alt text solely to drive search results should be avoided.
Crafting Alt Text
Before writing alt text, determine if it should convey the image’s content or function. Very rarely, an image may convey content and serve a function, but generally not
If the Image Serves A Function (linked images)
If the image serves as a hyperlink rather than conveying unique content, alt text
should be straightforward and describe the purpose of the image button or the location
to which the image hyperlinked.
In the example below, the image takes you to TU’s homepage, therefore, the alt text
is simply “Towson University.” There is no need to use words like “website,” “site,”
or “homepage” as that will be evident from the manner in which a screen reader recognizes
Function Alt Text Example
This image is hyperlinked to the TU website, so the alt text should describe the page
being linked to - in this case, alt text would be “Towson University.”
If the Image Conveys Content (non-linked images)
If the image is used to visually convey information, and does not serve as a hyperlink,
the alt text should convey the same information that the visual image conveys. Crafting
this type of alt text is not as straightforward as crafting alt text for images that
facilitate a function. Use these tips for guidance:
Do be equivalent and accurate in conveying the content of the image.
Do consider the context of your page or document (see the example below for more guidance).
Do be succinct. While you want to convey equivalent content to the image, it is important to avoid
alt text that goes into excessive detail, conveying more information than the image
conveys visually. In most cases, your alt text should just be a few words, though
for more complex images, a sentence or two may be appropriate.
Do use punctuation and proper sentence structure.
Don’t use the words “graphic of,” “image of” or similar phrasing. Screen-reading software knows when it encounters an image and communicates this.
Don’t use text within your image if at all avoidable. In some cases, it may be necessary to do. In these cases replicate the text within
the image verbatim.
What constitutes “good” or “accurate and equivalent” alt text can vary based on the
context in which the image is presented. Use your best judgment based on the context
of your document or webpage.
Alt text should be modified, depending on the context. For example, here is the same
image presented in two different contexts:
Context Example 1
The image appears on the TU homepage under the heading “Explore TU Programs.” Alt
text could be “three TU students smiling with their smartphones.” Since it is on a
TU site, these are not just young people, but TU students.
Context Example 2
The image is used in a document about social media use among recent high school graduates.
Alt text could be “three young adults smiling as they look at their smartphones.”
The important info is these are young adults (for example recent high school graduates)
using smartphones, not their background or location of study.
The next two images show examples of images that don't require a lot of details. The
context of the image can be explained with very little explanation.
Context Example 3
In this example, appropriate alt text would be “crowd at Towson University football
game.” This amount of text is succinct and conveys the same information displayed
visually without giving excessive details.
Context Example 4
In this example, a photo of Commencement speaker Beverly Tatum, appropriate alt text
would be “Beverly Tatum.” This is succinct and to the point. Details about attire,
etc., would be considered excessive.