Key Takeaways
-
Alt text is an image description in the HTML
alt=""attribute. Screen readers read it aloud; browsers show it as a fallback. - Google ranking: Alt text is an official ranking factor for Google Image Search. E-commerce sites generate up to 22.6% of organic traffic through images.
- Legal requirement: Since June 28, 2025, the European Accessibility Act (EAA) mandates accessible online shops — alt text for informative images is a WCAG 2.1 baseline requirement. Fines up to €100,000 in Germany; in the US, 4,500+ ADA lawsuits in 2024.
- Optimal length: 80–125 characters. Precise, keyword-relevant, without "image of"
-
Decorative images: Empty alt attribute (
alt="") — don't omit it entirely.
1. What Is Alt Text? Definition & Basics
Alt text (short for alternative text, also called alt tag, alt attribute, or alt description) is a short text description assigned to an image in a website’s HTML code. It describes what the image shows — for people who can’t see it and for search engines that can’t “understand” images.
The concept dates back to the early web: the alt attribute was introduced in the HTML 2.0 specification in 1995. Originally, it served as placeholder text while images loaded on slow connections. Today, alt text is a fundamental building block for three disciplines: accessibility, search engine optimization, and — since 2025 — legal compliance.
<img src="red-dress-summer.jpg" alt="Red summer dress with V-neckline in lightweight chiffon, model turning to the side">
Alt text is invisible during normal browsing. It becomes active in three situations:
On slow connections, blocked images (e.g. in email clients), or server errors, the browser displays the alt text as a fallback.
Blind and visually impaired users use software like JAWS, NVDA, or Apple’s VoiceOver. Without alt text, the screen reader reads the cryptic filename (e.g. “IMG_20240315_142037_HDR.jpg”).
Googlebot can now visually analyze images (via Google Lens technology), but still relies primarily on alt text to understand image content and index it in Image Search.
Remember: Alt text isn’t optional decoration — it’s a fundamental part of every informative image on the web. Since the EAA took effect on June 28, 2025, it’s legally required for most B2C businesses in the EU.
2. Why Is Alt Text Important? The 3 Crucial Reasons
Reason 1: Accessibility — 2.2 billion people depend on it
According to the WHO, 2.2 billion people worldwide have some form of visual impairment. In the US alone, 12 million people over 40 have vision impairment (CDC). 97% of all disabilities are acquired during life — not congenital. A good alt text helps visually impaired users picture the image. “Golden retriever with a red collar on a green meadow” creates a mental image — “dog” does not.
Screen readers process alt text in one continuous block — the user can’t skip back or pause. That’s why brevity and precision matter. Best practice: 80–125 characters.
Reason 2: SEO — 22.6% of all searches are image searches
Google Image Search is the world’s second-largest search engine — larger than YouTube and Bing combined. According to SparkToro analyses, 22.6% of all search queries happen through Image Search. For e-commerce websites, this channel is particularly valuable: users who find a product via Google Images often have significantly higher purchase intent.
Alt text is the most important ranking factor for Image Search. Without alt text, your images are practically invisible to Google. Additionally, Google increasingly shows images directly in regular search results — product images appear as Rich Results with thumbnail, price, and rating.
Reason 3: Legal requirement — EAA, ADA & more
Since June 28, 2025, the European Accessibility Act (EAA) mandates accessible online shops and digital services across all 27 EU member states. Alt text for all informative images is one of the most basic requirements (WCAG criterion 1.1.1 “Non-text Content”).
The consequences are real: fines up to €100,000 in Germany, up to €1,000,000 in Spain, and sales bans by market surveillance authorities. In the US, over 4,500 ADA lawsuits were filed in 2024, with average settlements of $25,000+. Missing alt text is a top-3 complaint because it’s trivially detectable by automated tools.
In the EU, the micro-enterprise exemption (under 10 employees AND under €2M revenue) only protects against the EAA itself — not against unfair competition claims by competitors. Even small shops should implement alt text.
3. Alt Text vs. Title Tag vs. Caption vs. Filename
There are four different text elements around images on the web that are frequently confused. Each serves a different purpose — and only one truly matters:
| Element | HTML | Visible? | SEO? | Screen Reader? |
|---|---|---|---|---|
Alt Text ⭐ | alt="..." | Only on load failure | Very high | ✓ Read aloud |
| Title Tag | title="..." | Tooltip on hover | Low | Usually ignored |
| Caption | <figcaption> | Yes, for everyone | Medium | ✓ Read aloud |
| Filename | src="name.jpg" | No | Medium | Only if alt missing |
Common mistake: Making alt text and caption identical. That’s redundant — screen reader users hear the same text twice. Better: alt text describes the image, caption provides context.
4. How to Write Alt Text: 10 Golden Rules
These ten rules are based on the WCAG 2.1 Guidelines, Google’s SEO documentation, and recommendations from accessibility experts.
Imagine describing the image to someone over the phone. What’s the key information?
JAWS (the most popular screen reader) truncates at around 125 characters. Rule of thumb: one to two sentences.
Screen readers automatically announce “Graphic: …”. Exception: when the image type is relevant (e.g. “Oil painting” or “Screenshot”).
Good: “Red summer dress with V-neckline in lightweight chiffon”. Bad: “dress red buy cheap fashion online order sale”.
alt="" (empty attribute) is NOT the same as a missing alt attribute!
The same image needs different alt text depending on the page. An Eiffel Tower photo on an architecture page vs. a travel page.
Banners, infographics, signs → the text must appear in the alt text.
alt="Summer Breeze dress in red — view product page"
Screen readers spell out emojis — disruptive in the middle of alt text.
Screen readers read alt text exactly as written — including typos.
5. Alt Text Examples: Good vs. Bad
Image: Red leather backpack on white background, front view
alt="Image of backpack" alt="backpack red buy cheap leather men women online" alt="Red backpack" alt="Urban Explorer backpack in red — genuine leather with zipper and padded laptop compartment, front view" alt="portrait.jpg" alt="Anna Miller, CEO of Company XY, smiling at the camera" alt="Beautiful colorful gradient from blue to purple" alt="" The screen reader skips the image — exactly right.
6. Alt Text for E-Commerce: Product Images Done Right
This section is specifically for online store owners. Product images have unique requirements — and offer the biggest SEO potential of all image types.
The Product Alt Text Formula
[Product Name] in [Color] — [Product Type] made of [Material], [View/Feature]
| Industry | Alt Text Example |
|---|---|
| Fashion | Summer Breeze dress in red — lightweight chiffon sundress with V-neckline, worn by model |
| Shoes | Oxford business shoe Milano in black — polished smooth leather, side view |
| Electronics | ProMax laptop 15-inch in space grey — open on desk, screen showing desktop |
| Furniture | Eames lounge chair replica in walnut and black leather — side view in living room |
| Food | Organic honey from the Black Forest in 500g jar with wooden lid, golden color |
The Scaling Problem: 500 Products × 5 Images = 2,500 Alt Texts
Manual writing takes 50–100 work hours for 2,500 images. At $100/hour agency rates, that’s $5,000–10,000. With AI tools like AutoAlt.ai, 2,500 images are processed in under one hour instead of 100 work hours.
7. Alt Text and SEO: Boost Your Image Search Traffic
7.1 How Google Indexes Images (Priority Order)
Alt text — The strongest signal.
Surrounding text — The paragraph the image is embedded in.
Filename — Descriptive, not “IMG_2024.jpg”.
Page title & meta
Visual AI (Google Lens) — Supplementary, not primary.
7.2 Keywords in Alt Text
- "Red summer dress with V-neckline in lightweight chiffon, ideal for beach vacation"
- "dress red summer dress buy cheap women's fashion online order sale deal"
8. Alt Text Requirements 2026: EAA, ADA & More
🇪🇺 EAA — European Accessibility Act (EU-wide)
In effect since June 28, 2025. Applies to all B2C digital services in 27 EU member states. Standard: WCAG 2.1 Level AA (EN 301 549).
- Spain: Fines up to €1,000,000
- Netherlands: Up to €900,000 or 10% of annual revenue
- France: Up to €250,000 (4 retailers sued, Nov 2025)
- Germany: Up to €100,000
🇺🇸 ADA — Americans with Disabilities Act (USA)
- 4,500+ ADA lawsuits in 2024 alone
- Average settlement $25,000+
- Missing alt text = top-3 complaint, trivially detectable by automated tools
🇬🇧 UK Equality Act & Others
The UK Equality Act 2010, Canada’s ACA, Australia’s DDA, and Japan’s JIS X 8341 all include web accessibility provisions. Alt text is universally required across all frameworks.
The irony: adding alt text is one of the cheapest and fastest accessibility measures. While keyboard navigation or color contrast require significant refactoring, alt text can be AI-generated in minutes.
9. Alt Text in WordPress & WooCommerce
WordPress powers 43% of all websites, WooCommerce 68% of all WP shops. Four ways to add alt text:
Method 1: Block Editor (Gutenberg)
Click an image in the editor → sidebar → “Alt text (alternative text)” field. Best for individual images.
Method 2: Media Library (for existing images)
Media → Library → click image → “Alternative Text” field. Changes auto-save. Impractical for 500+ images.
Method 3: WooCommerce Product Images
Products → Edit → Product Image/Gallery → click to open in Media Library. Each gallery and variation image needs its own alt text.
Method 4: Automated via Plugin (100+ images)
The AutoAlt.ai WordPress plugin generates alt text via AI — on upload or in bulk for your entire media library. Compatible with Yoast SEO, Rank Math, WPML, and Polylang. All generated alt texts are stored as real HTML alt attributes — they persist even if you deactivate the plugin.
10. Alt Text in Shopware 6
Product images: Catalogues → Products → Edit → “Media” tab → click image → “Alternative description”.
Category images: Catalogues → Categories → Edit → Image upload → Alt text field.
Shopping Experiences (CMS): Click image in block → Settings → Alt text.
Manufacturer logos: Catalogues → Manufacturers → Edit → Logo → Alt text.
The AutoAlt.ai Shopware plugin is the only AI-powered alt text plugin in the Shopware Store. Automatic translation into all storefront languages included.
11. Generate Alt Text Automatically with AI
Manual vs. AI Comparison
| Criterion | Manual (Agency) | AI (AutoAlt.ai) |
|---|---|---|
| Speed (1,000 images) | 40–80 hours | 15–30 minutes |
| Cost (1,000 images) | $4,000–8,000 | $45 (Pro Credit Pack) |
| Consistency | Varies by writer/day | Uniform style |
| SEO optimization | Depends on writer's SEO knowledge | Automatic (keywords, product names) |
| Multilingual | Separate translator needed | 130+ languages included |
| CMS integration | Copy-paste into each field | Direct in WordPress/Shopware |
→ The 7 Best Alt Text Tools 2026 Compared
Alt Text in Minutes, Not Weeks
AutoAlt.ai generates SEO-optimized alt text via AI — directly in WordPress, WooCommerce, Shopware, Joomla, and Drupal. 50 credits/month free. Made in Germany.
50 credits/month forever free • No credit card • 2 min setup
12. Alt Text Checklist: 5-Minute Website Audit
Find missing alt text: Chrome → F12 → Lighthouse → Accessibility test. Or: AutoAlt.ai Scanner.
All product images have alt text: Main image, gallery AND variation images. Each unique.
Product names in alt text. Not just “red shoe”.
No keyword stuffing. Natural sentences.
Decorative images have alt="".
Alt text under 125 characters.
No “Image of” at the start.
Text in images reproduced.
Linked images describe the link target.
Filenames descriptive: “red-summer-dress.jpg” not “IMG_2024.jpg”.
13. Frequently Asked Questions
How long should alt text be?
Ideally 80–125 characters. JAWS (the most popular screen reader) can handle longer text, but it’s read in one continuous block — too long is fatiguing. For complex images like infographics: keep alt text brief, explain details in surrounding text.
Does every image need alt text?
No. Only informative images. Decorative images (backgrounds, dividers, atmospheric icons) get an empty alt attribute: alt="". This is NOT the same as a missing attribute — an empty attribute tells the screen reader to skip the image.
Is alt text legally required?
Yes, in most jurisdictions. The EU’s European Accessibility Act (EAA) has been in effect since June 28, 2025. In the US, the ADA applies (4,500+ lawsuits in 2024). In Germany, fines reach €100,000; in Spain up to €1,000,000.
What happens without alt text?
Three consequences: (1) Screen readers read the cryptic filename aloud. (2) Google can’t index the image — you lose Image Search traffic. (3) You risk fines and legal action, since missing alt text is detectable by automated tools in seconds.
Can AI write good alt text?
Yes. Modern multimodal AI models (GPT-4o, Gemini) analyze images accurately. Specialized tools like AutoAlt.ai additionally use CMS context (product name, category, focus keywords) for SEO-optimized results. Texts can be manually edited at any time.
How do I find missing alt text on my website?
Multiple options: Chrome → F12 → Lighthouse → Accessibility audit. SEO tools like Ahrefs Site Audit, Semrush, or Screaming Frog. Or use the free AutoAlt.ai Accessibility Scanner.
Should I write "Image of" or "Photo of"?
No. Screen readers automatically announce “Graphic:” before reading the alt text. “Image of” is redundant. Exception: when the image type matters — e.g. “Oil painting by Monet” or “Screenshot of the WordPress dashboard”.
How much does alt text cost for my online store?
Manually: ~$2–5 per image at agency rates ($100/h, 2–3 min/image). For 1,000 images = $2,000–5,000. With AI via AutoAlt.ai: 50 credits/month permanently free, then from $4.49/month (100 credits) or $45 one-time for 1,000 credits. 1 credit = 1 image, all language versions included.
What alt text length does Google recommend?
Google doesn’t specify an official character limit but recommends “short and descriptive”. In practice, 80–125 characters have proven optimal — long enough for a precise description, short enough for screen readers.
Generate Alt Text Automatically — Start Free
AutoAlt.ai generates SEO-optimized alt text via AI for WordPress, WooCommerce, Shopware, Joomla, and Drupal. EAA compliant. GDPR compliant. Made in Germany.
50 credits/month forever free • No credit card • 2 min setup