All images should be meaningful, and all meaningful images must have alt text. Never use images of text. All text content on the website should be real text.

Alt (alternative) text is an informative description of an image, graph, diagram, or other visual resource as it relates to content on a web page. Alt text also provides an alternative way for users to access the meaning conveyed by images and graphics.

Images of text are meaningless to users who cannot see them and aren’t recognized as text by the browser or search engines. Never put text in your image. If you want an image with a text overlay, use the Cover block in the WordPress block editor.

What Alt Text Does

Alt text provides descriptive information about an image when it’s not available to the user. An image’s alt text is not typically visible on a web page, but alt text will replace images when images are turned off on websites, when images do not load, and when a screen reader is used to read out website content.

Alt text also has a positive impact on search engine ranking, making your content more discoverable. Well-written alt text allows search engine crawlers to more appropriately index images. Google and Bing count alt text as part of the on-page text because it is exactly that for visually impaired users.

How to Write Effective Alt Text

Common Errors

  • The image contains text (that isn’t a part of the photo content).
  • The file name of the image (like “12345_img12.jpg”) is used for the alt text.
  • “Image of” or “Photo of”, etc. is used as part of the image alt text.
  • “Photo” is the only alt text used to describe an image; alt text is not descriptive.
  • The image caption and the image alt text are the same.
  • The image photographer or copyright information is the description for the alt text instead of the caption.

To ensure website accessibility, all images, graphs, and diagrams must have alt text. Purely decorative images — such as some decorative iconography — use an empty alt text attribute (alt=""), but content managers will never use purely decorative images.

When writing a text alternative for an image or graphic, think about the role the image plays on the page. Your description should sufficiently describe what is being presented in as few words as possible. Alt text needs to convey the same information as the image in the given context.

The following guidelines outline the properties of effective alt text:

  • A clear, succinct description of the image (keep the explanation brief). The description shouldn’t exceed a short sentence or two. Ideally, the description should be less than 100 characters because some screen readers will not read after 125 characters.
  • No need to provide every tiny detail in the image. In most cases this is not necessary, and can become verbose.
  • Don’t start alt text with “Image of,” “Photo of,” or something similar. Screen readers will identify images by default, so it would be repetitive.
  • Include a period at the end of the alt text. The period allows the screen reader to pause after the last word in the alt text.
  • Complex images like graphs, charts, diagrams, maps, and illustrations, frequently require longer descriptions. Following are some ways to add a longer text description for complex images:
    • Add description as a caption for the image.
    • In addition to the brief alt text description, add the detailed description in the surrounding web page text.
    • Link to a separate web page to provide the longer description.

Adding and Updating Alt Text in WordPress

There are a few ways to add alt text in WordPress:

  • When Adding an Image.
  • In the Block Sidebar Settings.
  • From the Media Library.

When Adding an Image

It’s easiest to add alt text when initially uploading or adding an image.

  1. After uploading an image, the image details will appear in the media library window under the Attachment Details heading.
  2. Locate the Alt Text field and enter your alternate text for the image, with a period at the end. The Media Library will automatically save the alt text.
  3. You can now insert the image anywhere on the site and the alt text will be automatically filled in.

In the Block Sidebar Settings

You can edit existing alt text or add missing alt text directly from the page or post edit screen.

If using the block editor:

  1. Select the image you want to edit and look for the Image settings panel in the block sidebar settings.
  2. Add your alt text in the Alt Text field.

If using the classic editor:

  1. Select the image to bring up the image editor toolbar, then select the edit icon (designed to look like a pencil) to open the Image Details window.
  2. Locate the Alternative Text field and enter your alt text for the image, with a period at the end. Make sure to save your changes with the Update button.

From the Media Library

You can add alt text to images directly from the Media Library (accessed via the primary navigation menu in the WP admin area).

  1. Select any image to open its attachment details window.
  2. Locate the Alt Text field, and enter the alt text for the image. It will save automatically.

Important: Adding alt text from the Media Library will only apply the new alt text to images inserted into pages from that point on. Any images added to a page before the alt text was created will not include the new alt text. You will have to manually update those.