Alt Text (Alternative Text)
A text description of an image that is displayed if the image fails to load and is read by screen readers.
Detailed Explanation
Alt text is essential for accessibility and image SEO. It allows visually impaired users to understand the context of an image. For search engines, alt text is the primary way they understand what an image depicts. Good alt text is descriptive, concise, and avoids 'keyword stuffing'.
Quick Summary
Alt text (`<img alt="...">`) is the text description of an image. It serves two audiences: screen readers (so blind users know what the image shows) and search engines (which can't 'see' images but read the alt). Write it as if describing the image to someone who can't see it.
Key Takeaways
- Describe the image's content and purpose, not just its appearance.
- Keep it under ~125 characters, most screen readers cut off after that.
- Decorative images (visual fluff) should have empty alt: `alt=""`, NOT missing alt.
- Don't start with 'Image of' or 'Picture of', screen readers already announce it as an image.
- Don't stuff keywords, Google's image AI is sophisticated enough to detect this.
When to use it
- Charts and graphs: describe the data, not the visual ('Bar chart showing 45% growth in Q3').
- Product photos: include color, material, key features.
- Decorative borders/dividers: `alt=""` to hide from screen readers.
- Icons with text labels: `alt=""` (the label already provides context).
- Image SEO: ranking in Google Images search.
Common Mistakes
- Missing alt attribute entirely (different from `alt=""`), screen readers may read the filename.
- Using `alt="image"` or filename, useless to both screen readers and SEO.
- Keyword stuffing, `alt="best PDF tool free PDF merger online PDF"`.
- Repeating caption or surrounding text in alt, creates duplicate announcements.
- Long, novel-length alt text, keep it concise.
Alt Text (Alternative Text), Frequently Asked
What's the difference between empty alt and missing alt?
Empty (`alt=""`) tells screen readers to skip the image. Missing alt makes screen readers fall back to filenames, usually unhelpful.
Does alt text affect SEO?
Yes, it's the main signal for Google Image Search rankings, and contributes (mildly) to overall page relevance.
What about complex images like infographics?
Provide a short alt, then a longer description in surrounding text or via `aria-describedby` pointing to a hidden full description.