Three wooden, square pieces that spell out 'Alt'

Image Alt Text: What is it & How to Add it?

What is Alt Text?

Alternative text, or alt text as it’s more commonly known, is a description of an image within the HTML code of a webpage.

The primary purpose of alt text is to support an image with a written description, aimed at improving accessibility of websites for those who’re visually impaired, using features such as screen readers.

When used correctly, alt text can provide context and meaning to a webpage for those who wouldn’t have been able to understand it otherwise.

Alt Text & Search Engine Optimisation (SEO)

Despite their improvements to accessibility, SEOs and webmasters use alt text as an additional way to optimise each of their webpages for higher rankings on the Google results page.

Adding the primary keyword of the webpage, in a natural way, to the images’ alt text is a well-known strategy to improve rankings for that page.

Adding alt text to images also helps search engines, such as Google, index the images easier. As crawlers don’t ‘view’ images like humans do, the added context that alt text provides helps the search engines understand the image and index it.

Examples of Alt Text (Good & Bad)

Image 1:

Close-up image of a silver-spotted skipper moth, perched on a green leaf.

Bad alt text = Moth on leave

Good alt text = Close-up image of a silver-spotted skipper moth, perched on a green leaf.

HTML example = <img src=”moth.png” alt=”Close-up image of a silver-spotted skipper moth, perched on a green leaf”>

Image 2:

A young man, in his early 20s, sat on a yellow seat writing in a notebook. The man is wearing black glasses, a denim shirt, and blue jeans.

Bad alt text = Man

Good alt text = A young man, in his early 20s, sat on a yellow seat writing in a notebook. The man is wearing black glasses, a denim shirt, and blue jeans.

HTML example = <img src=”man.png” alt=”A young man, in his early 20s, sat on a yellow seat writing in a notebook. The man is wearing black glasses, a denim shirt, and blue jeans.”>

Image 3:

Light blue, vintage Volkswagon Beetle, parked on the street outside a suburban home in America.

Bad alt text = car

Good alt text = Light blue, vintage Volkswagon Beetle, parked on the street outside a suburban home in America.

HTML example = <img src=”man.png” alt=” Light blue, vintage Volkswagon Beetle, parked on the street outside a suburban home in America”>

How to Add Alt Text to Images on WordPress

Now you know what alt text is and its benefits; but, do you know how to actually add alt text to images on a WordPress website?

Well, we’ll show you how to add alt text to images when uploading a new image, and we’ll show you how to add alt text to an existing image.

Adding Alt Text When Uploading an Image to WordPress

  1. Access your WordPress Media Library
  2. Upload your image
  3. Find the ‘Alternative Text’ box and input your descriptive alt text

Adding Alt Text to Existing Images

  1. Access your WordPress Media Library
  2. Click on the desired image
  3. Find the ‘Alternative Text’ box and input your descriptive alt text

Check out our other posts

Join The List

Subscribe to our newsletter for GRA updates and more fun.