Product Page Accessibility: Writing Alt Text That Sells and Complies

Alt text is the single most important accessibility element on product pages. Screen reader users cannot see your product images—they depend entirely on alt text to understand what you're selling. Missing or poor alt text is also the top accessibility issue triggering eCommerce lawsuits, appearing on over 54% of websites according to the 2024 WebAIM Million analysis.

This guide teaches you to write alt text that serves customers with disabilities while also supporting SEO and conversion goals. You'll get templates for common product types, examples across categories, and strategies for managing alt text at scale.

What Alt Text Does (And Why It Matters)

Alt text (alternative text) is a text description embedded in an image's HTML that describes the image's content and purpose. When a screen reader encounters an image, it reads the alt text aloud instead of displaying the visual.

The User Experience Without Alt Text

When alt text is missing, screen readers handle images differently depending on configuration:

• Some announce the filename: "SKU-12345-front-dot-jpg"
• Some say simply: "Image"
• Some skip the image entirely

None of these help a blind customer understand your product. They can't see that your sweater is navy blue with a V-neck, that your coffee table has tapered legs, or that your handbag has gold hardware. Without alt text, you're asking people to buy products they can't evaluate.

The Legal Requirement

WCAG Success Criterion 1.1.1 requires text alternatives for all non-text content. This is a Level A requirement—the most fundamental category. Courts consistently cite missing alt text as evidence of WCAG violations in accessibility lawsuits.

With 4,600+ ADA website lawsuits filed in 2023, and eCommerce sites as primary targets, missing product image alt text creates clear legal exposure.

The SEO Benefit

Search engines can't "see" images either—they rely on alt text to understand image content. Descriptive alt text:

• Helps images appear in Google Image search
• Provides context for page relevance
• Supports overall page SEO
• Creates another opportunity for natural keyword inclusion

Good accessibility and good SEO align perfectly on alt text.

Anatomy of Effective Product Alt Text

Effective alt text describes what a sighted user would see and need to know to make a purchase decision.

Key Elements to Include

Product type: What is this item?

• Sweater, sofa, handbag, watch, coffee maker

Color and pattern:

• Navy blue, forest green, floral print, herringbone

Material:

• Leather, cotton, stainless steel, oak, ceramic

Style and fit (where applicable):

• V-neck, slim fit, mid-century modern, oversized

Distinguishing features:

• Brass buttons, USB-C charging, removable cushions

Perspective (for multiple images):

• Front view, side angle, detail of zipper, shown on model

Alt Text Formula

For most products, this template works well:

[Color/Pattern] [Material] [Product Type] with [Key Features], [Perspective if needed]

Examples:

• "Black leather crossbody bag with gold chain strap and magnetic closure"
• "Gray linen mid-century modern loveseat with walnut tapered legs, front view"
• "Stainless steel automatic espresso machine with built-in grinder and steam wand"

Length Guidelines

• Ideal length: 50-150 characters
• Minimum: Enough to describe the product meaningfully
• Maximum: Under 250 characters (some screen readers truncate longer text)

Be concise but complete. Don't pad with unnecessary words, but don't omit important details either.

Alt Text Examples by Product Category

Apparel

| Poor Alt Text | Effective Alt Text                                                                   |
|---------------|--------------------------------------------------------------------------------------|
| "dress"       | "Women's emerald green silk midi dress with V-neck and flutter sleeves"              |
| "men's shirt" | "Men's light blue Oxford cotton button-down shirt with button-down collar, slim fit" |
| "shoes"       | "Women's tan suede ankle boots with 3-inch block heel and side zipper"               |
| "jacket"      | "Men's black leather motorcycle jacket with asymmetric zipper and quilted shoulders" |

Key elements for apparel:

• Gender/intended wearer
• Color and material
• Style/cut name
• Fit (slim, relaxed, oversized)
• Notable design features

Furniture

| Poor Alt Text | Effective Alt Text                                                                            |
|---------------|-----------------------------------------------------------------------------------------------|
| "sofa"        | "Three-seat sectional sofa in charcoal gray performance fabric, L-shape with chaise on right" |
| "table"       | "Round dining table with white marble top and brushed gold pedestal base, seats four"         |
| "chair"       | "Mid-century modern armchair in burnt orange velvet with walnut frame and tapered legs"       |
| "bed"         | "King-size platform bed frame in natural oak with upholstered headboard in cream linen"       |

Key elements for furniture:

• Size/capacity
• Style/era
• Color and material for all visible components
• Configuration (for sectionals, modular pieces)
• Key features (storage, adjustability)

Electronics

| Poor Alt Text | Effective Alt Text                                                                              |
|---------------|-------------------------------------------------------------------------------------------------|
| "headphones"  | "Over-ear wireless headphones in matte black with cushioned ear cups and adjustable headband"   |
| "laptop"      | "15-inch laptop computer in silver, open showing keyboard and display, side view showing ports" |
| "camera"      | "Mirrorless digital camera body in black with 50mm prime lens attached, front angle view"       |
| "speaker"     | "Portable Bluetooth speaker in navy blue fabric cover with carrying strap, cylindrical shape"   |

Key elements for electronics:

• Product type with key specifications
• Color/finish
• Physical form factor
• What's shown (ports, display content, accessories)

Home Goods

| Poor Alt Text | Effective Alt Text                                                                                                    |
|---------------|-----------------------------------------------------------------------------------------------------------------------|
| "mug"         | "Ceramic coffee mug with hand-painted blue floral design, 12-ounce capacity with comfortable C-handle"                |
| "vase"        | "Tall clear glass vase with narrow neck and wide base, 14 inches tall, shown with eucalyptus stems"                   |
| "cookware"    | "5-piece stainless steel cookware set including 8-inch and 10-inch skillets, 2-quart and 3-quart saucepans with lids" |
| "bedding"     | "Queen-size duvet cover in white waffle weave cotton with button closure, shown styled on bed"                        |

Key elements for home goods:

• Material and construction
• Size/capacity/dimensions when relevant
• Design details
• What's included (for sets)
• Styling context if shown in use

Beauty and Personal Care

| Poor Alt Text | Effective Alt Text                                                                                                       |
|---------------|--------------------------------------------------------------------------------------------------------------------------|
| "lipstick"    | "Matte lipstick in deep berry shade, sleek black and gold tube packaging, cap removed showing product"                   |
| "skincare"    | "Daily moisturizer in frosted glass jar with silver lid, 2-ounce size, product shown with lid off revealing white cream" |
| "fragrance"   | "Women's eau de parfum in rectangular clear glass bottle with pink liquid and rose gold cap, 3.4 oz"                     |

Key elements for beauty:

• Product type and form
• Color/shade of product
• Packaging description
• Size
• What's visible in the image

Multiple Images and Variant Alt Text

Product pages typically have multiple images showing different angles, details, and variants. Each needs unique alt text.

Main Image vs. Supporting Images

Main/hero image: Provide the complete product description: "Men's classic navy blue wool overcoat with notch lapel and double-breasted front"

Supporting images: Reference the main product and describe what this specific image shows:

• "Navy wool overcoat back view showing center vent"
• "Navy wool overcoat detail of horn buttons"
• "Navy wool overcoat interior showing silk lining and inside pocket"
• "Navy wool overcoat shown on male model, front view"

Product Variants

When the same product comes in multiple colors, patterns, or materials, each variant image needs alt text describing that specific variant:

• "Women's cotton cardigan in coral" (for coral swatch)
• "Women's cotton cardigan in sage green" (for green swatch)
• "Women's cotton cardigan in navy stripe" (for stripe variant)

Don't just change one word—ensure each variant's distinctive features are captured.

Model/Lifestyle Images

When products are shown on models or in context:

• Include what the product looks like (not just "shown on model")
• Describe relevant context if it affects understanding
• Mention fit or scale information visible in the image

"Light blue Oxford shirt shown on male model demonstrating relaxed fit through torso, sleeves rolled to elbow"

Common Alt Text Mistakes

Mistakes to Avoid

Generic placeholders:

• "Product image"
• "Photo"
• "Image 1 of 4"
• "[Product name]"

Filenames and SKUs:

• "IMG_4521.jpg"
• "SKU-BLK-DRESS-001"
• "frontview1"

Keyword stuffing:

• "Buy best affordable blue dress women's dresses sale cheap blue dress online"

Duplicate alt text: Using identical alt text for different images, especially variants.

Empty alt text on product images: alt="" is correct for decorative images, but product images are never decorative—they convey essential content.

Starting with "Image of" or "Picture of": Screen readers already announce it's an image. "Image of a blue dress" wastes words.

Edge Cases

Product photography with props: Describe the product, not the staging. A candle photographed with pinecones and holly doesn't need "with seasonal decorations" unless the decorations are included with purchase.

360-degree views or product videos: Provide alt text describing what the viewer will see, or use longer descriptions. For videos, provide captions and/or transcripts.

User-generated images (customer photos): These create challenges. Options:

• Request alt text from customers submitting photos
• Use AI to generate draft alt text for review
• Add disclaimer that customer photos may not have descriptions

Managing Alt Text at Scale

Large catalogs require systematic approaches to alt text.

Template-Based Generation

Create formulas for each product category that content teams can apply:

Apparel template: [Gender]'s [Color] [Material] [Product Type] with [Feature 1] and [Feature 2], [Fit Type]

Furniture template: [Style] [Product Type] in [Primary Material/Color] with [Secondary Material/Color] [Feature], [Size/Capacity Info]

Training content teams:

• Provide templates with examples
• Create reference guides for terminology
• Review samples before full implementation
• Spot-check regularly for quality

AI-Assisted Alt Text

AI image recognition can generate draft alt text that humans review and refine. This approach:

Advantages:

• Dramatically speeds initial creation
• Provides consistent starting points
• Scales to large catalogs

Limitations:

• May miss product-specific details (brand, model names)
• Can misidentify colors or materials
• Requires human review for accuracy

Workflow:

1. Generate AI descriptions for all products
2. Review by product category experts
3. Add missing details (specific materials, brand terms)
4. Verify accuracy against actual products

Prioritizing Remediation

If facing a large backlog of images without alt text:

1. Highest priority: Product pages with most traffic/revenue
2. High priority: Products appearing in marketing campaigns
3. Medium priority: Category and collection page images
4. Lower priority: Lesser-trafficked product variants

Track progress systematically. Use TestParty's scanning to identify images missing alt text across your entire catalog.

Content Management Integration

Build alt text into product content workflows:

Required fields: Make alt text a required field in your PIM or product management system.

Validation rules: Block product publication without alt text.

Import/export: Include alt text columns in product CSV imports.

Editorial review: Include alt text in content review checklists.

Alt Text and SEO

Accessibility and SEO goals align on alt text—both benefit from accurate, descriptive text.

SEO Best Practices That Support Accessibility

Be descriptive and specific: Instead of "boots," write "women's brown leather knee-high boots with low heel." This helps search engines understand the image and helps screen reader users.

Include natural keywords: The product type and attributes you'd naturally include for accessibility also serve as keywords.

Avoid keyword stuffing: Text that sounds unnatural to a human sounds unnatural to screen readers. Write for humans first.

What Not to Do for SEO

Don't sacrifice clarity for keywords: "Best affordable leather boots sale cheap" helps no one.

Don't ignore user experience: Screen reader users will hear every word. Prioritize their experience.

Don't duplicate alt text across pages: Each image should have contextually appropriate alt text.

FAQ: Product Image Alt Text

How long should product alt text be?

Product alt text should be 50-150 characters—long enough to describe the product meaningfully, short enough to not overwhelm screen reader users. Include product type, color, material, and key distinguishing features. Some screen readers truncate text over 250 characters, so stay well under that limit.

Should alt text include the product name or brand?

Include brand name if it's essential to understanding the product (designer items, recognizable brands) or if it's part of the product name. Skip it if the brand is displayed elsewhere on the page and including it would make alt text redundant or lengthy. Focus on describing what the image shows.

What about decorative images on product pages?

True decorative images—background patterns, visual separators, purely aesthetic elements—should use empty alt text (alt=""). However, most images on product pages are functional, not decorative. Product photos, comparison images, sizing charts, and instructional images all need descriptive alt text.

How do I handle images with text?

If an image contains text (size chart, care instructions, promotional text), the alt text should convey the same information as the text in the image. For complex text-heavy images, consider using actual HTML text instead of images, or provide the text content nearby on the page with the image marked as decorative.

Can I use the same alt text for the same product on different pages?

Use consistent alt text for the same image appearing in different contexts. If the main product image is used on category pages and the product page, the same alt text works. However, if context changes how the image is used (thumbnail vs. hero), minor adjustments may be appropriate.

Start Improving Your Product Alt Text Today

Missing or inadequate alt text creates legal risk, excludes customers, and misses SEO opportunities. Implementing effective alt text across your product catalog removes barriers for screen reader users while strengthening your site's overall performance.

Begin by identifying where you stand. TestParty's AI-powered platform scans your entire eCommerce site, finding every image missing alt text and flagging low-quality placeholders. Get a complete inventory of what needs fixing, prioritized by page importance and user impact.

Get your free accessibility scan →

Originally customer-exclusive research from TestParty, we're publishing this openly. We want this information indexable, shareable, and usable—by developers, businesses, screen readers parsing the web, and AI models alike.

This article reflects TestParty's human-AI collaboration. AI assisted with drafting; humans ensured accuracy and nuance. We share our methodology openly and encourage you to approach this information thoughtfully—or connect with us for personalized accessibility guidance.

Related Articles

• The 3 Accessibility Issues That Get eCommerce Sites Sued (And How to Fix Them)
• Shopify Accessibility: Complete Guide to Making Your Store Compliant
• Accessible Checkout: Converting More Customers by Removing Barriers