Alt Text Best Practices

Overview

Alt text (alternative text) is a short, written description added to an image. It is read aloud by screen readers for people who cannot see the image, and it appears in place of the image if it fails to load. Writing good alt text is one of the most impactful things a content creator can do for accessibility. This guide explains what alt text is, when to use it, how to write it well, and where to add it across different tools.

↑ Return to Top

What is Alt Text?

When you add an image to a website, email, or document, sighted users can see and understand it. But people who are blind or have low vision use software called a screen reader, which reads the content of a page aloud. A screen reader cannot describe an image — it can only read text. Alt text is that text.

Alt text also helps in other situations:

  • When an image fails to load, the alt text appears in its place
  • Search engines use alt text to understand what an image shows
  • People using slow internet connections sometimes turn images off — alt text tells them what they are missing

Think of it this way

Imagine describing an image to someone over the phone who cannot see your screen. You would tell them what the image shows and why it matters in context. That is exactly what good alt text does.

↑ Return to Top

When to Write Alt Text (and When Not To)

Not every image needs alt text. The key question is: does this image convey information that a reader would miss if they could not see it?

Images that need alt text

  • Photos that illustrate a point or tell part of the story
  • Charts, graphs, and diagrams
  • Logos (when they appear as content, not just background branding)
  • Infographics
  • Screenshots that show how to do something
  • Images of people, places, or objects that are relevant to the content
  • Buttons or icons that are images (e.g., a magnifying glass icon that acts as a Search button)

Images that do NOT need alt text (leave the field blank)

  • Purely decorative images — borders, dividers, background textures, or stock photos that add visual interest but no information
  • Images that are already fully described in the text right next to them
  • Repeated logos in headers and footers where the organization name appears as text nearby
⚠️ Important!

Leaving alt text blank is a deliberate choice that tells screen readers to skip the image entirely. Only do this for truly decorative images. If you are not sure whether an image is decorative, write alt text for it.

↑ Return to Top

How to Write Good Alt Text

Good alt text is accurate, concise, and contextual. Here are the core principles.

  1. Describe what the image shows, not what it looks like
    Focus on the meaning and content of the image, not its visual appearance. A screen reader user does not need to know that the photo has warm lighting or a shallow depth of field — they need to know what is in it and why it is there.
     
  2. Keep it concise — aim for one or two sentences
    Alt text should be brief. Most alt text should be under 125 characters, which is roughly one short sentence. If the image is complex (a chart or diagram), you may need more — but keep it as tight as possible.
     
  3. Include context
    The same image can need different alt text depending on where it is used. A photo of a crowded street might be: 'Busy high street in Birmingham city centre' on a tourism page, but 'Protestors gathered outside Birmingham City Hall' on a news article. The context shapes what matters.
     
  4. Do not start with 'Image of' or 'Photo of'
    Screen readers already announce that something is an image before reading the alt text. Starting with 'Image of a dog playing' means users hear 'Image, image of a dog playing' — which is redundant. Start with the description directly: 'Dog playing fetch on a sunny beach.'
     
  5. Do not stuff alt text with keywords

↑ Return to Top

Alt Text by Image Type

Different types of images need different approaches. Here are examples for the most common types.

Photographs
Avoid Better
image.jpg Two colleagues reviewing a document together at a desk
Note: Include who or what is in the photo and what they are doing. You do not need to describe clothing, hair colour, or background details unless they are relevant.
Charts or Graphs
Avoid Better
Bar chart Bar chart showing website visitors by month in 2024. Traffic peaked in March at 42,000 visits and dropped to its lowest in August at 18,000.
Note: Describe the trend or key takeaway, not just the chart type. If the chart is very detailed, summarise the main point in alt text and provide the full data in the surrounding text.
Logos
Avoid Better
logo.png Acme Corporation logo
Note: For a logo used as content, the organization name is usually sufficient. You do not need to describe the visual design of the logo unless it is specifically relevant.
⚠️ Important!

The alt text for the UAH logo should always be “The University of Alabama in Huntsville logo”.

Infographics

Avoid Better
[Long string of all text found within the image] Alt Text: Infographic: Steps to submit an expense claim.

Body Text: Provide the full information from the infographic as regular, screen-readable text on the page nearby.
Note: Infographics are complex images where alt text alone is rarely enough. Always pair a concise alt text title with a full text alternative in the surrounding body of the article.
Screenshots
Avoid Better
screenshot.png Joomla article editor showing the Paragraph Format dropdown open, with Heading 2 highlighted
Note: Describe what is visible on screen and what the user's attention should focus on. This is especially important for instructional content.
Decorative Images
Avoid Better
decorative-banner.jpg Use alt= "" "" or use the check box specifically labeled "Mark as decorative"
Note: Leaving alt text empty tells screen readers to skip this image. Only do this if the image adds no meaningful information.

↑ Return to Top

Where to Add Alt Text

The location of the alt text field varies depending on the tool you are using. Here is a quick reference:

Where How to Add Alt Text Field Name
Joomla Insert image via Media Manager or article editor, then fill in the Alternative Text field in the image properties panel Alternative Text
Microsoft Word Mouse: Right-click image > Edit Alt Text
Keyboard: Select image > Shift + F10 (Win) or Cmd + Opt + J (Mac)
Alt Text
Google Docs Mouse: Right-click image > Alt text.
Keyboard: Select image > Ctrl + Alt + Y (Win) or Cmd + Opt + Y (Mac)
Title / Description
PowerPoint Mouse: Right-click image > Edit Alt Text
Keyboard: Select image > Shift + F10 or Menu Key
Alt Text
Gmail Insert image > select the image to highlight it > open the three-dot menu below image > Edit alt text. Alt text
Outlook Mouse: Right-click image > Format Picture > Alt Text tab
Keyboard: Select image > Shift + F10, then press O then A
Description
PDF (Adobe) Use Tags panel or Tools > Accessibility > Set Alternate Text. Alternate Text
Social Media Look for Add alt text or Edit alt text in the image options before posting Alt text / Description

↑ Return to Top

Common Mistakes to Avoid

Mistake Do This Instead
Starting with 'Image of' or 'Picture of' Start directly with the description: 'Dog playing fetch on a beach'
Leaving alt text blank for meaningful images Always write alt text if the image conveys information.
Writing alt text for decorative images Leave the alt text field blank for purely decorative images.
Repeating the caption word for word Alt text and captions serve different purposes — alt text should describe the image; captions provide context or credit.
Using the filename as alt text (e.g., 'IMG_4823.jpg') Write a meaningful description of the image content.
Keyword stuffing Write naturally: 'Staff member completing an online training module'
Writing 'no alt text' or 'N/A' in the field Either write a real description or leave the field genuinely blank.

↑ Return to Top

Quick Checklist

Use this before publishing any content that includes images.

Does every meaningful image have alt text?
Does the alt text describe what the image shows (not just what it looks like)?
Is the alt text concise — ideally one sentence or fewer than 125 characters?
Does the alt text avoid starting with 'Image of' or 'Photo of'?
For charts and graphs, does the alt text convey the key finding or trend?
For infographics, is the full information also available as regular text?
For screenshots, does the alt text describe what is shown on screen?
Are decorative images marked with a blank alt text field (not left out by accident)?
Are image filenames avoided as alt text?
Has keyword stuffing been avoided?

↑ Return to Top

See Also

Need help or have questions?

Please email the UAH Accessibility Mailbox or visit the Accessibility at UAH Website for more resources.

↑ Return to Top

Print Article

Related Articles (2)

This article provides basic information about accessibility and a listing of UAH accessibility resources.
This guide covers the essential steps to ensure your Outlook emails are accessible to all recipients, including those using screen readers, high-contrast themes, or keyboard navigation.