1
0
mirror of https://github.com/jbranchaud/til synced 2026-01-02 22:58:01 +00:00
Files
til/html/adding-alt-text-to-an-image.md
2019-12-02 12:53:47 -06:00

1.1 KiB
Raw Blame History

Adding Alt Text To An Image

Images on their own are not accessible to anyone using a screen reader. As the people putting content on the web, we can make images more accessible by providing alternative text. This is such a standard that linters not only flag <img /> tags that are missing the alt attribute, they also admonish you for unhelpful description text like "image."

You can appease the linter and make your content accessible with some descriptive text:

<img src="some/image.jpg" alt="a graph with lines trending up" />

When appropriate, you can also choose to include the alt attribute with a blank value.

If an image is purely decorative, then we add alt="" to let screen readers know that its not important. But if an image is informative, then we need to be supplying a text alternative that describes the picture for anyone whos using a screen reader or isnt able to see the image.

Part of accessibility is not putting a bunch of noise in front of your users. If the image isn't part of the content, use alt="".

source