What is Alt Text

Alt Text is the text alternative to an image. It can

  • be read by a screen reader for visually impaired users
  • be read by bots for search engines
  • give details of the image if the user is on a slow network or has chosen not to view images

You should use Alt Text when an image is used to "tell your story", rather than for decoration.

The Alt Attribute (or Alt Tag)

You may have heard of the Alt Tag. The text that you add to an image for screen readers. Apparently it's not a tag, it's an attribute. But this is only really important if you're writing code.

As a writer of words for the Local Offer, the important thing to remember is that

Every image must have an Alt Attribute

BUT

Some Alt attributes can be empty

A blank Alt attribute is added by using double quote marks

Alt = ""  

If the image is purely decoration, use this empty, or null, Alt attribute.

Alt Text does NOT have to be part of the Alt tag

If you have text around the image which explains what's in the image then an additional Alt attribute would be too much. The screen reader will read the information from the body text, and then again from the image.

📝Do all your images have a Alt Text?

Next: The Hero image →

Discussion

Log in to join the discussion. Your comment will be checked before it appears publicly.