Alt Text: Accessibility and SEO Guide

Alt text (alternative text) describes images for people who can’t see them. Screen readers announce this text, enabling blind and low-vision users to understand visual content.

It’s also an SEO factor—search engines can’t “see” images either, so they rely on alt text to understand image content.

Getting alt text right improves accessibility, SEO, and overall content quality.

Why Alt Text Matters

Accessibility

Over 285 million people worldwide have visual impairments. Screen readers convert page content to speech, but without alt text, images are announced as “image” or by their filename—meaningless to the user.

Good alt text:

<img src="team-meeting.jpg" alt="Marketing team reviewing Q3 campaign results" />

Bad or missing:

<img src="IMG_3847.jpg" />
<!-- Screen reader: "IMG underscore 3847 dot jpg" -->

SEO

Search engines use alt text to:

Understand image content
Index images for image search
Understand page context
Support ranking factors

Fallback for Broken Images

When images fail to load, alt text displays instead, preserving meaning.

How to Write Good Alt Text

Be Descriptive but Concise

Describe what the image shows in 1-2 sentences.

Good: “Woman typing on laptop at coffee shop” Too vague: “Person” Too long: “A young woman in her 30s wearing a blue sweater sitting at a wooden table in a warmly lit coffee shop with exposed brick walls typing on a silver MacBook Pro while a cup of cappuccino sits beside her”

Convey Purpose, Not Just Appearance

Ask: why is this image here? What information does it communicate?

Image of a graph:

Appearance: “Bar chart with blue and green bars”
Purpose: “Sales increased 40% from Q2 to Q3 2026”

The purpose version is usually more useful.

Context Matters

The same image might need different alt text in different contexts:

Product page:

<img alt="Navy blue wool sweater with crew neck" />

About us page:

<img alt="Our founder wearing a sample from our first collection" />

Include Relevant Keywords (Naturally)

Alt text is an SEO opportunity, but don’t stuff keywords:

Natural: “Corco Labs team at our San Francisco office” Stuffed: “Software development agency Bay Area software developers software engineering services Corco Labs”

Don’t Start with “Image of” or “Picture of”

Screen readers already announce that it’s an image.

Don’t: “Image of a sunset over the ocean” Do: “Sunset over the Pacific Ocean with orange and purple clouds”

When to Use Empty Alt Text

Some images are decorative—they add visual interest but no information. Use empty alt text:

<img src="decorative-divider.png" alt="" />

This tells screen readers to skip the image.

Decorative images include:

Border patterns
Background textures
Purely visual dividers
Icons that duplicate adjacent text

Don’t mark meaningful images as decorative just because alt text is hard to write.

Alt Text for Different Image Types

Photos

Describe the scene, people, and action:

<img alt="Developer debugging code on dual monitors in home office" />

Product Images

Include key product details:

<img alt="Black leather messenger bag with brass buckles, front view" />

Charts and Graphs

Summarize the data or insight:

<img alt="Line graph showing 200% revenue growth from 2024 to 2026" />

For complex data, consider providing a longer description elsewhere on the page.

Logos

Name the organization:

<img alt="Corco Labs logo" />

Screenshots

Describe what the screenshot shows:

<img alt="Dashboard showing user analytics with 5,000 monthly active users" />

Icons

If meaningful, describe the action. If decorative (next to text that says the same thing), use empty alt:

<a href="/cart"> <img alt="" src="cart-icon.svg" /> Cart (3 items) </a>

Common Alt Text Mistakes

Missing Alt Attribute

No alt attribute at all:

<img src="photo.jpg" />

This causes screen readers to announce the filename.

Generic Alt Text

Non-descriptive placeholders:

<img alt="photo" />
<img alt="image" />
<img alt="banner" />

File Names as Alt Text

<img alt="IMG_4532.jpg" /> <img alt="product-photo-final-v2.png" />

Keyword Stuffing

<img
  alt="best software development company top software engineers custom software development services enterprise software"
/>

Too Long

Alt text over ~125 characters may be cut off. Be concise.

Auditing Existing Images

Large sites can have hundreds or thousands of images. Auditing manually is impractical.

What to Look For

Missing alt attributes: No alt at all
Empty alt on meaningful images: alt="" on informative images
Generic alt text: “image”, “photo”, “banner”
Filename alt text: Technical file names
Overly long alt text: Walls of text

Our Alt Text Checker

The Alt Text Checker scans any page and reports:

Total images found
Images with good alt text
Images with missing alt
Images with empty alt
Images with generic/poor alt text
Specific recommendations

It’s free and gives you a prioritized list of images needing attention.

Bulk Auditing

For site-wide audits:

Crawl your site (Screaming Frog, Sitebulb, etc.)
Export all images and alt text
Filter for missing or poor alt text
Prioritize by page importance

Implementing Alt Text

Content Management Systems

Most CMS platforms have alt text fields:

WordPress: In the media library and image block
Shopify: Product image settings
Squarespace: Image caption/alt field

Train content creators to fill these in consistently.

In Code

Always include the alt attribute:

<img src="image.jpg" alt="Description here" />

For decorative images:

<img src="decoration.jpg" alt="" />

Responsive Images

Alt text applies to the <img> tag regardless of srcset:

<img
  src="small.jpg"
  srcset="medium.jpg 800w, large.jpg 1200w"
  alt="Team collaboration in the office"
/>

Social platforms have their own alt text features:

Twitter/X: Alt text button on images
Instagram: Advanced settings when posting
Facebook: Automatic alt text (often poor) plus manual option
LinkedIn: Alt text option on image posts

Using platform-native alt text improves accessibility for your social content too.

Legal Requirements

Many accessibility laws require alt text:

ADA (US): Websites must be accessible
Section 508: Government sites
WCAG 2.1: AA standard requires alt text
European Accessibility Act: EU requirements

Missing alt text is often cited in accessibility lawsuits.

Take Action

Check a key page with Alt Text Checker
Identify images needing improvement
Write descriptive alt text for meaningful images
Mark purely decorative images with empty alt
Establish guidelines for future content

For accessibility audits or implementation help, reach out.