Images as links

Here's a screenshot of part of a Local Offer home page:

How will we write the Alt Text?

Here are the questions we need to ask:

1. Is the image purely decorative?

YES - Alt = ""

NO -

2. Does the surrounding text describe the image?

YES - Alt = ""

NO -

3. Does the image have a title?

YES - Alt = ""

NO -

4. Is the image a link?

YES -

5. Is there link text?

YES - Alt = ""

Because the image is a link, and because there is text too, the image itself only needs an empty attribute.

I know it's a bit sad, because these images are lovely, but the function overrides the looks.

Technical note

In fact, these images are background images and won't be seen by the screen reader at all. Depending on how your tech team have set things up, this is usually the best option for link images.

📝 Check the Alt Text for your "image buttons". These might be photos or icons. Have you repeated the Alt Text? Share some examples of your "image buttons" in the discussion.