What is alternative text (alt text)?

Alternative text (alt text) is a text description of an image, set through the alt attribute inside the <img> tag. It exists to convey the meaning of a picture when a user cannot see it, for example:

• a person with a visual impairment is using a screen reader;
• the image failed to load;
• the browser blocks images;
• the content is being indexed by search engines.

---

#Example

If the image does not display, the user (or a screen reader) will "see" the phrase:

"A golden retriever playing with a ball in a meadow"

---

#Why alt text is needed

1. For accessibility (a11y) Screen readers read alt and announce the description: blind users understand what is shown. Without alt, they simply hear:

"image1234.jpg" - which carries no meaning.

2. For SEO Search engines cannot "see" pictures, but they read alt. This helps them understand the page's content and index images for image search.
3. For a fallback display If the image fails to load, alt tells the user what should have been there.
4. For analytics and contextual advertising Some ad and analytics systems use alt text to understand what an image is about and select relevant content.

---

#How to write good alt text

Describe the meaning, not just the contents. Bad:

Good:

Keep it short and to the point (up to ~125 characters). Do not start with "Image" or "Photo": the screen reader already announces that it is an image. If the picture is decorative (carries no meaning), set an empty alt:

Then the screen reader will skip it.

---

#Comparison example

---

#Conclusion:

Alternative text (alt text) is a description of an image's meaning, added through the alt attribute. It makes sites:

• understandable for screen readers,
• indexable for search engines,
• usable even when a picture fails to load.

Good alt turns visual content into a clear text-based experience for every user.