Alternative Text
Alternative text (alt text) is a brief description of an image specified in the alt attribute within HTML code. Alt text is used by search engines, screen reader software for people with visual impairments, and is displayed if an image fails to load for any reason. It helps convey the content of an image without viewing it.
What is Alternative Text?
Alternative text is a textual description of an image embedded in the page code:
<img src=”photo.jpg” alt=”A red bicycle on a white background”>
It allows:
- Search engine bots to understand what is depicted in the image.
- Users with screen readers to receive a description of the image.
- Displaying the image’s meaning if it fails to load.
Why Alt Text is Needed
SEO
Search engines use alt text to index images. A well-written alt text helps:
- Improve a site’s visibility in search results.
- Appear in image search.
- Supplement the page context with relevant information.
Accessibility
Screen readers vocalize alt text for people with visual impairments.
Usability
If an image doesn’t load, the user sees the alt text and understands what should have been shown.
How to Write Alt Text Correctly
- Be concise and to the point (5–12 words).
- Accurately describe the image.
- Consider the context of the page.
- Use a keyword if it is appropriate and natural.
- Avoid “fluff” like: “picture,” “photo,” “image.”
- Do not use alt text as a keyword spam list.
Examples of Correct Alt Text
- Image: A laptop on a wooden desk.
alt=”An Apple laptop on a wooden desk” - Image: A product — red sneakers.
alt=”Red Nike Air Max women’s sneakers” - Image: A promotional banner.
alt=”20% discount on winter collection”
When Alt Text Can Be Omitted
If an image is purely decorative (background, an icon without meaningful content), the alt attribute should be left empty (alt=””). This prevents screen readers from announcing it.
How Alt Text Differs from Title
| Attribute | Purpose |
| alt | Describes the image for SEO and accessibility. |
| title | A tooltip that appears when the cursor hovers over the element. |
Alt text is more important for search engines and accessibility.
Conclusion
Alternative text is a short textual description of an image contained in the alt attribute. It is crucial for SEO, accessibility, and the correct display of content when images fail to load.
Core Principle:
Alt text should describe an image as if you were explaining it in words to someone who cannot see it.
