What Is Alt Text? The Complete Beginner's Guide

Alt text — also called alternative text, alt tags, or alt attributes — is a short description added to an HTML image tag. It tells search engines and screen readers what an image shows. If an image fails to load, the alt text is displayed in its place.

Here is what it looks like in HTML code:

<img src="red-apple.jpg" alt="Fresh red apple on a white background">

That small piece of text does three critical jobs: it helps Google understand your images, it makes your site accessible to visually impaired users relying on screen readers, and it can appear when images fail to load on slow connections.

Why Alt Text Matters for SEO

Google cannot see images. It reads text. When you add descriptive alt text, you are giving Google a text description of a visual element — essentially translating your images into a language search engines understand.

This matters because Google Images drives roughly 22% of all web searches. Every image on your site without alt text is a missed opportunity to appear in image search results.

Alt Text vs Alt Tag vs Alt Attribute — What's the Difference?

How to Write Perfect Alt Text

The Core Rules

• Be specific and descriptive — describe what is actually in the image
• Keep it under 125 characters — screen readers often cut off at 125 characters
• Never start with "image of" or "picture of" — screen readers already announce it as an image
• Include your focus keyword naturally — but only if it genuinely describes the image
• Don't keyword stuff — writing "red apple buy apples apple fruit apples UK" is spam

Good vs Bad Alt Text — Real Examples

Alt Text for Different Image Types

Product Images (Etsy, Shopify, Amazon)

Include the product name, key feature, colour, and material. Example: Handmade ceramic coffee mug in sage green with leaf pattern

Infographics and Charts

Describe the key message the data conveys, not just the visual format. Example: Line graph showing 40% increase in organic traffic after adding image alt text

Decorative Images

Use an empty alt attribute: alt="". This tells screen readers to skip the image entirely. Never leave out the alt attribute completely — that causes screen readers to read out the filename instead.

Stock Photos

Describe the content with context: Diverse team of professionals in a meeting room brainstorming ideas

Where to Add Alt Text

Common Alt Text Mistakes to Avoid

• Leaving the alt attribute out entirely (different from an empty alt="")
• Using the filename as alt text (e.g., alt="IMG_20230415_123456.jpg")
• Stuffing keywords unnaturally
• Writing identical alt text for multiple different images
• Describing decorative images instead of using alt=""

How Alt Text Helps Accessibility

Over 7.7 million people in the UK and US alone use screen readers. When someone with visual impairment visits your site, their screen reader reads out the alt text for every image. Without alt text, the reader either says nothing or reads out the filename — providing zero useful information.

WCAG 2.1 (Web Content Accessibility Guidelines) requires meaningful alt text for all informative images. Failure to comply can expose businesses to legal risk in many jurisdictions including the US under the ADA and the UK under the Equality Act 2010.

Frequently Asked Questions

Does every image need alt text?

Every informative image needs descriptive alt text. Decorative images (borders, backgrounds, visual flourishes) should have an empty alt attribute: alt="".

How long should alt text be?

Under 125 characters is the widely recommended limit. Most good alt text is between 50-100 characters.

Does alt text directly affect Google rankings?

Yes — for image search rankings specifically. It also contributes to overall page relevance signals for standard web search.

Related Articles