1. First, consider using an icon font and screenreader accessible text instead of the image
2. If you can’t, then the alt attribute should denote the function of the link, not the content of the image

Examples:

Alt text should be "Call" not "Phone icon"

Alt text should be "Send email to" not "Envelop icon"

Alt text should be "Correct" or "Incorrect" not "Checkmark" or "X"

1. All of the text in the image, with all acronyms expanded and in proper sentence case, should be the alt text.
2. Nothing more, nothing less, just that text that it is in essence replacing.

Examples:

Alt text should be "Class to Career Conference, January 9-12" as the background content is irrelevant.

Alt text should be "Celebrate! Watch the 2016 American University Holiday Video" as the acronym "AU" should be expanded.

1. First, consider whether this special treatment is truly needed.
2. If you must it should be implemented as a CSS background image. Contact your department's Content Publishing Lead or the OIT Web Team via the Help Desk for assistance.

Example:

1. Usually, we strive to avoid redundancy, but if absolutely nothing else can be said about the image just repeat the person's name.

Examples:

Alt should be "President Obama addresses the American University community" as the context of him being on campus is likely relevant to the usage of this picture.

Alt should be "Official portrait of President Obama" as the official nature of this image may be of interest.

Alt text should be "President Barack Obama" as the background and his sartorial choices are irrelevant (unless it is the infamous tan suit)

1. If they are specific people, list all the names and give some directional context (i.e. "Left to Right" or "Front Row")
2. If the specifics of the people are unimportant in context use a collective noun: “Students...”, “Attendees...”, “Officials...” and what they are doing

Examples:

Alt text should be "Left to right: President Obama, Vice President Biden, and Secretary Clinton in the Oval Office" Note: strive for concision and only use as many names/titles as are necessary.

Alt text should be "Students studying outside the School of International Service building"

1. If details of the image are important to understanding of the content and they are not presented in the surrounding content then present those details as the alt attribute.
2. For example, an image of Monet's Water Lilies or Seurat’s La Grande Jatte can mention the brush strokes when presented in the context of an art history page on the difference between the Impressionists and Pointilists.

Examples:

Alt text could be "Seurat's brush strokes are mostly round often with space between them for the canvas to show through" in the right highly specialized context.

In most other cases, the alt text should be a brief and succinct summation: "Close up of a Seurat painting"

1. Present a brief, concise, succinct summation of the gist of the image as it is being used in its context.
2. Never use the words:
   1. Photo/Photograph
   2. Image
   3. Graphic
   4. Picture/Pic
   5. Icon
   6. Banner/Ad (may be blocked by ad blockers)
   7. Logo/Seal/Crest (except where the official nature of the image is important such as on a policy document)

Examples:

Alt text should be "Artistic rendering of race relations" and not get into the various media being used.

Alt text should be "2016 News" or "2016 Headlines" as it is a combo of text replacement and image providing some of that information.

Alt text should be the concept of "Police work" as the specifics of what police work is occuring aren't important as shown by the cropping

Alt text should be "American University Bookstore" as the fish-eye nature of the photograph is unimportant.

Example

Explanation