Why use alt=""?

I was reading the lesson on Images in HTML

and came across a section that said

What exactly should you write inside your alt attribute? It depends on why the image is there in the first place. In other words, what you lose if your image doesn’t show up:

  • Decoration. You should use CSS background images for decorative images, but if you must use HTML, add a blank alt="" . If the image isn’t part of the content, a screen reader shouldn’t waste time reading it.
  • Content. If your image provides significant information, provide the same information in a brief alt text – or even better, in the main text which everybody can see. Don’t write redundant alt text. How annoying would it be for a sighted user if all paragraphs were written twice in the main content? If the image is described adequately by the main text body, you can just use alt="" .

At that point why even use alt=“” ? Why not just omit the alt attribute completely, wouldn’t that be more efficient?

Hello @Mahoney

when a screen reader find image it do the following

  1. if it has alt then it will read that alt text
  2. if there no alt attribute it will say image (which does not help the user)
  3. if it has alt="" it will not say anything as if the image is not there

check this one https://accessibility.psu.edu/images/imageshtml/#empty

hope that help and have a nice day :slight_smile:

2 Likes

One reason you want the empty alt tag is so the screen reader can announce that it is an image as the user tabs thru the page.

1 Like