Alt Text
Alt Text (alternative text) is a descriptive text string written in the `alt` attribute of an HTML `<img>` tag. It is displayed in place of the image when the image cannot be rendered or visually perceived.
Alt Text (alternative text) is a descriptive text string written in the alt attribute of an HTML <img> tag. It is displayed in place of the image when the image cannot be rendered or visually perceived.
Why It Matters
Alt Text plays a critical role in both accessibility and SEO.
First, screen readers read the alt attribute value aloud, enabling visually impaired users to understand the content of an image. The WCAG (Web Content Accessibility Guidelines) Level A standard requires alternative text for all non-text content.
Second, search engine crawlers cannot "see" images directly, so they rely on the alt attribute to understand the subject matter of an image. Google has officially confirmed that alt text is a ranking signal for image search. Images with well-written alt text are more likely to appear in Google Image Search and visual search tools such as Google Lens.
Third, generative AI systems like ChatGPT and Perplexity also use alt text as an important information source when analyzing images, making it increasingly important from a GEO (Generative Engine Optimization) perspective.
Writing Guidelines
- Be specific. Write based on the question: "What information would a user miss if they couldn't see this image?"
- Keep it under 125 characters. Most screen readers truncate alt text beyond approximately 125 characters.
- Include relevant keywords naturally. Weave in one or two keywords that align with the context of the page content.
- Omit prefixes like "image of," "photo of," or "picture of." Screen readers already announce the element as an
<img>, so this is redundant. - Use empty alt (
alt="") for decorative images. Adding descriptions to decorative images that serve no content purpose creates unnecessary noise for screen reader users.
Good Examples vs Bad Examples
| Type | Alt Text | Reason |
|---|---|---|
| Good | Handmade vegan chocolate cake on a white plate | Specific, concise, and conveys the essential information of the image |
| Good | Line chart showing monthly organic traffic trends in 2025 | Clearly describes the chart type and the data subject |
| Bad | Cake | Too vague — impossible to tell what kind of cake |
| Bad | Cake photo image dessert delicious cake chocolate cake handmade cake vegan cake | Keyword stuffing — may be flagged as spam |
| Bad | IMG_20250301_142055.jpg | A raw filename that is meaningless to both users and search engines |
Common Mistakes
- Keyword Stuffing: Repeatedly listing keywords in alt text may be classified as spam by Google and severely harms user experience. Keywords should be included naturally within context.
- Using the Same Alt Text for All Images: Copy-pasting the same description across multiple images on a page may cause search engines to treat them as duplicate content. Each image should have a unique description reflecting its specific content.
- Omitting Alt Text Entirely: If the alt attribute itself is missing, screen readers will read the filename aloud, significantly degrading accessibility. Even decorative images must include an empty alt attribute (
alt=""). - Using AI-Generated Alt Text Without Review: Alt text suggested by AI tools may not fully reflect the context. Human review and optimization for page content is always necessary.
- Copying Body Text Verbatim: Placing the same caption or body text that appears next to an image into the alt text causes screen reader users to hear the same content twice. Alt text should complement, not duplicate, the surrounding text.
Related inblog Posts
How inblog Helps
inblog's editor provides an Alt Text input field when inserting images and displays a warning when it's left empty.