Digital Accessibility: Alt Text

Overview

Alt text (alternative text) is a brief description added to images to make digital content accessible for people using screen readers. It ensures that individuals who are blind or visually impaired can understand the purpose and context of images in documents, websites, and learning platforms. Adding Alt text is a simple yet impactful step toward inclusive digital accessibility.

Video Training

Video Link: https://mediaspace.mines.edu/media/Digital+Accessibility%3A+Alt+Text/1_pfluoiaa/349042832

Step-By-Step Guide

Understanding When to Use Alt Text

Alt text should be added to images in various digital spaces, including:

  • Websites (WordPress, Mines pages) – Ensures site visitors using screen readers can access image information.
  • Canvas (Course Modules, Assignments, Pages) – Helps students with disabilities engage with course content.
  • Documents (Microsoft Word, Google Docs, PDFs) – Provides accessible reading experiences in reports, presentations, and more.
  • Social Media (Facebook, Instagram, Twitter, LinkedIn) – Makes images in posts accessible to all users.
  • Email Marketing (Mailchimp, Outlook, Gmail) – Ensures promotional materials and newsletters are inclusive.

Adding Alt Text in WordPress

  1. Log in to your WordPress site.
  2. Navigate to the page or post where you want to add an image.
  3. Click the + (Add Module) button and select Add Image.
  4. Choose an existing image or upload a new one.
  5. In the right-hand panel, locate the Alt Text field.
  6. Enter a brief, meaningful description of the image.
  7. Click Update to save changes.

Writing Effective Alt Text

When writing Alt text, follow these best practices:

  • Keep it concise, ideally under 140 characters.
  • Describe what is important about the image without using phrases like "image of" or "picture of," as screen readers already indicate that it is an image.
  • Be specific and focus on key details.
  • If the image contains text, include that text in the Alt text unless it is already provided elsewhere in the content.
  • For complex images like schematics or charts, provide a more detailed description elsewhere on the page rather than trying to fit everything into the Alt text.

Examples:

  • Good Alt Text: "Two Mines students working in a computer science lab."
  • Poor Alt Text: "A photo of two students sitting at a desk in a room."

Decorative images generally do not need Alt text. If an image does not convey essential information, it can be left blank or marked as decorative.

Checking Alt Text on Existing Websites

To check if an image has Alt text:

  1. Visit the webpage and right-click on an image.
  2. Select "Inspect" or "Inspect Accessibility Properties" (depending on the browser).
  3. Look for the Alt attribute in the code.
  4. Ensure the Alt text accurately describes the image.

If Alt text is missing or unclear, update it in the content management system (WordPress, Canvas, etc.).

Using AI for Alt Text (with Caution)

AI tools like ChatGPT and Google Gemini can generate Alt text, but they may:

  • Be too detailed or too vague.
  • Miss key details like event names, locations, or people’s names.
  • Generate descriptions that are longer than necessary.

Example of AI-generated Alt text:
"A ribbon-cutting ceremony outside a modern building, with people holding large ceremonial scissors cutting a blue ribbon."

A better, more specific version:
"Ribbon cutting at the Labriola Innovation Hub grand opening at Mines."

AI-generated Alt text should always be reviewed and edited for accuracy and brevity.

Adding Alt Text in Other Platforms

  • Canvas: Locate the Alt Text field when adding an image and enter a description.
  • Microsoft Word & Google Docs: Right-click an image, select "Alt Text," and add a description.
  • Social Media: Most platforms allow Alt text to be added before posting an image. Check for an Alt Text option in the post settings.

Best Practices

  • Always add Alt text to images that provide meaningful information, such as diagrams, infographics, or important photos.
  • Skip Alt text for decorative images that do not add context.
  • Keep descriptions brief but specific.
  • Review AI-generated Alt text for accuracy.

Support and Resources

If you have questions or need assistance, Mines IT is here to help. Call us at 303-278-HELP (4357) or visit us at the IT Service Desk in CTLM 156.

Print Article