Alt text for images

Alt text (short for alternative text) is a written description of an image that is added to the image’s HTML code using the alt attribute. It serves several critical purposes—especially on healthcare organization websites where accessibility, trust, and clarity are essential. Alt text is also beneficial the user experience and can improve SEO rankings.

Accessibility standards overview
ALT text for images
Keyboard navigation
Color contrast
PDFs

Standard scope

This standard applies to:

  • pennmedicine.org
  • All Penn Medicine websites
  • Penn Medicine mobile applications
  • All Penn Medicine digital products

Overview

Alt text is an important component of accessibility compliance requirements to “Provide equivalent alternatives to auditory and visual content.”  At Penn Medicine, we adhere to Web Content Accessibility Guidelines (WCAG), to ensure that websites are usable by a wider audience, including those who rely on screen readers or other assistive technologies.

Penn Medicine guidelines for alt text

Refer to these guidelines when creating alt text for images:

  • Describe the image shortly and succinctly. Limit to a max of 150 characters.
  • For professional headshots, use “headshot of <professional’s name with title>” so the screen reader will say “Image of headshot of…”
  • For example: headshot of Christopher O’Connor, MD (no quotes)
  • For group photos you can put “group shot of” or just try to describe what is happening.
  • For example: group shot of volunteers at blood drive
  • Images with text should be avoided, with the following exceptions and criteria:
  • The text is essential (e.g., logos on a shirt, signs on a building).
  • The text is customizable (e.g., responsive buttons).
  • If images with text are used:
  • The text must also be available in an accessible format (e.g., in alt text, nearby HTML, or ARIA labels).
  • The image text must meet contrast and legibility requirements as defined by WCAG.
  • The alt text cannot be used in a way that prevents screen readers from accessing the content.
  • Don’t use the following words and symbols:
  • Image - Alt text is read by a screen reader, and it will already read “image of” before the alt text and “end image” after the alt text – so you don’t have to put “image” in the actual alt text. And it will also come up as an error.
  • Photo, Graphic, Infographic - The screen reader will treat all of these as images, so you can see it would be confusing for the reader to say “Image of photo of…”
  • “” (quotes surrounding alt text) - The screen reader will read these aloud which will confuse the user.
  • Don’t use the same alt text more than once on a page.

Contact

For questions, contact web-standards@pennmedicine.upenn.edu.

Last updated

Date
Version
Desciption
06/11/25
1.0.0
Initial Release