15

Example: a biography page with a picture of the person. The image contains no useful information, yet it adds enough emotional value to the page that simply removing it is not the solution.

If you set the alt text to the empty string "", that would prevent users browsing with screen readers from having to hear useless information like "a picture of John Doe, CEO" when that information is already present elsewhere on the page. However, it would prevent users with extremely slow connections (such as on tablets in rural areas) from knowing what the image would be before they finished downloading it.

If you give the image alt text, then the problems would be reversed. Users with extremely slow connections would know what they were downloading before it loaded, but blind users would have to listen to text that conveys no additional information.

Supposing that each of the two user types holds an equal stake in your site, should the images be given alt text when they contain no additional information yet appear in the main page content?

2
  • Unfortunately if you leave out alt tags for any reason the code won't validate to W3C standards http://validator.w3.org/ May 23, 2013 at 8:24
  • 1
    I'm pretty sure that setting the tags to "" still validates. Omitting the tag wasn't part of the question; setting it to the empty string was. May 23, 2013 at 12:36

2 Answers 2

28

You should use an empty alt attribute for images that are purely decorative. I'd argue that in the example you gave it is worth supplying an alt attribute that describes the image e.g. alt="Portrait of Jane Doe". @KitGrose mentions that including this text will also make the image searchable to image search engines such as Google Image.

I reserve empty alt attributes for things like having a search icon next to the text "search" on a search button - it is purely decorative and a screen reader would just read "search" twice if I added alt text.

The example you give is additional content that it may be useful to reference, even if the person can't see it.

Since your main concern is content being read out multiple times by assistive technology like screen readers, you can add the aria-hidden attribute to your image element (and/or set role="presentation") to notify assistive technology that it shouldn't be read aloud.

4
  • 7
    I agree. Additionally, I'm of the school that says purely decorative images, like an icon in or next to a button, should be handled by css. The HTML should (to the extend possible of course) just contain content. If the image is there, apparantly it's content and should have an alt text. Even if just to indicate what's missing if it's not loaded. May 20, 2013 at 20:20
  • Agree, also some users for different reasons disable images, and will only load or allow images that interest them. An image clearly labeled makes it easier for these users too (Dial up for one). May 20, 2013 at 21:02
  • 7
    @3nafish: if you don't want a screen reader to announce an item, you should use the aria-hidden attribute. Remember alt text is also useful for things like Google Image Search and other non-screenreader users.
    – Kit Grose
    May 21, 2013 at 1:14
  • @KoenLageveen that isn’t always possible, for example in emails since only very basic CSS is supported and background images also aren’t very well supported you have to resort to images for some of the most basic effects like shadows Apr 12, 2022 at 2:54
1

The image contains no useful information

I’d say it contains very useful information, because, well, it depicts the person the page is about.

If the only reason to use an empty alt value is because of (text) content duplication, you should ask yourself: Could screen reader users still download/identify this image?

When you’d use an empty alt value for this photo, screen reader users would have a hard time to download it:

  • they would not know that there is a photo at all
  • if they’d know that there is a photo, they might have problems identifying it (if there are several images with empty alt)
  • if they’d have identified it, they might still not know if the photo contains only the relevant person or maybe other persons, too
2
  • But why would they want to know what the photo contains? If they can't see it and the information is already displayed elsewhere on the page, why would they want to know what's in the image? Giving it an alt tag of "" should make most screen readers skip it. May 24, 2013 at 14:29
  • 1
    @3nafish: There are countless use-cases. Just because they can’t see the image, doesn’t mean that they are not interested in it or that they don’t want to do anything with it. Think of a blind person sending the image to a friend ("Do you know this guy? Is he in the room right now?"), using it for a blog post, downloading it to archive it, printing it out to hang it on the wall, or, just being curious (what the page contains, what the image contains, how the person the page is about presents herself, …).
    – unor
    May 26, 2013 at 13:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.