The Ecommerce Image Alt Text Style Guide: Patterns That Work in 2026

Alt text is the cheapest accessibility win in ecommerce, and most stores still get it wrong. The two most common failure modes are (1) leaving it blank, which fails WCAG and forfeits image SEO, and (2) keyword-stuffing it with awkward strings that read like spam to assistive tech and to Google. The fix is a style guide — a small set of patterns the team applies consistently, so alt text becomes a reflex, not a copywriting decision made fresh on every product upload.

Below is the alt text style guide we recommend to ecommerce stores running on any platform: Shopify, WooCommerce, BigCommerce, Magento, Squarespace, custom. Adopt it, document it, and audit against it quarterly.

Pattern 1 — Product Images: Brand + Product + Variant + View

Formula: [Brand] [Product Name] - [Color/Size/Variant] - [Angle/View]

Examples:

• "Nike Air Max 270 - Men's Black/White Size 10 - Side View"
• "Lululemon Align High-Rise Pant - Women's Navy 28-inch - Front View"
• "Bosch GXL18V-291B25 18V Drill Kit - Side View"

Why this pattern works: it includes the natural-language search terms a shopper would use ("brand + product + size"), it's accessible (a screen reader user understands what they're looking at), and it doesn't keyword-stuff. The "view" qualifier is critical for image galleries — alt text that just repeats the same string for image-1, image-2, image-3 fails screen reader users who can't tell which image they're tabbing through.

Pattern 2 — Lifestyle / Editorial Images: Subject + Action + Context

Formula: [Subject] [doing action] [in context], wearing/using [product]

Examples:

• "Woman jogging on a forest trail in autumn, wearing the Brooks Ghost 16 running shoe"
• "Two friends laughing at a beach picnic, eating from the YETI Roadie 24 cooler"
• "Father teaching son to ride a bike in a suburban driveway, both wearing Giro Tremor helmets"

Lifestyle images sell the dream, not the product spec. The alt text should reflect that — describe what's happening, who's there, what mood the image conveys. The product name appears at the end as the connecting tissue. This is also where Google's image search starts catching long-tail informational queries ("women trail running autumn") that lead to product discovery.

Pattern 3 — Hero Banners: Action Phrase + Visual Cue

Formula: [Promotional message]: [visual description]

Examples:

• "Spring Sale 30% Off: woman in linen dress walking through a flower market"
• "New Arrivals: men's running shoes lined up on a track at sunrise"
• "Gift Guide 2026: assortment of wrapped boxes against a forest-green background"

Hero banners often have text overlays. Don't repeat the visible text verbatim in alt — assistive tech will read it twice (once from the image alt, once from the visible heading or text element). Instead, describe what the image conveys plus the promotional context.

Pattern 4 — Decorative Images: Empty Alt

Formula: alt=""

If an image is purely decorative — a divider line, an icon next to text that already describes the function, a background pattern — give it an empty alt attribute (not missing, not "decorative", an empty string). This tells screen readers to skip it. The mistake to avoid: writing alt="decorative-image" or alt="banner-3.jpg" — both worse than empty because they waste the screen reader user's time.

How to identify decorative images: if removing the image entirely wouldn't reduce a sighted user's understanding of the page, it's decorative. Brand logos that link to the homepage are an exception — they need alt text describing the link target ("Acme Corp homepage").

Pattern 5 — Infographics and Charts: Description + Data Source

Formula: Chart titled "[Title]" showing [key insight]. [Optional: detailed description in adjacent text or longdesc].

Examples:

• "Bar chart titled 'Customer Satisfaction by Quarter 2025' showing satisfaction climbing from 78% in Q1 to 92% in Q4"
• "Infographic showing the 5 steps of our quality assurance process: design, prototype, test, refine, ship"

For complex charts, the alt text gives the headline insight; the full data set should appear in a table or detailed description nearby. The mistake: alt="chart" or alt="graph showing data" — meaningless to a screen reader user.

Pattern 6 — Logos: Company Name (+ Link Target if Linked)

Formula: [Company Name] logo (or [Company Name] homepage if linked)

Brand logos in headers, footers, and trust-signal sections should describe the brand, not the visual ("blue circle with white text"). If the logo links somewhere — typically the homepage — describe the destination, since the alt text functions as link text for assistive tech.

The Anti-Patterns

Things to never do:

• Keyword stuffing: "buy nike running shoes online cheap free shipping nike air max" — flagged as spam by Google, useless to screen readers.
• File names as alt text: "DSC_0142.jpg", "image-1.jpg", "product-image-final-v2.jpg" — capture nothing.
• Redundant prefixes: "Picture of...", "Image of...", "Photo showing..." — assistive tech already announces "image". You're wasting words.
• Same alt for every image in a gallery: if you have 6 product photos with identical alt text, blind users can't distinguish them. Differentiate by view, angle, or context.
• Empty alt on meaningful images: the inverse of #4 — if the image conveys information, it needs alt text. Empty alt is for decoration only.
• Putting the entire product description in alt: alt is for the image, not the product spec sheet. Keep it under 125 characters when possible.

Auditing Your Catalog

Most ecommerce stores have hundreds or thousands of product images. Manual review isn't viable. Run an automated audit weekly to catch:

• Images with missing alt attributes (critical violation)
• Images with empty alt that aren't actually decorative (likely missed during upload)
• Alt text exceeding 125 characters (probably keyword-stuffed)
• Alt text containing file extensions like .jpg or .png (file name was used as alt)
• Identical alt text across multiple images on the same page (gallery problem)

The StoreVitals WCAG Accessibility Checker runs all of these checks plus 8 more accessibility audits in seconds, free.

The Operational Workflow

Style guides only work when they're operationalized. Here's the workflow that sticks:

1. Document the patterns in your team's CMS authoring guide. One page, with examples for each image type.
2. Train uploaders. Whoever adds product photos — merchandising, content, agency — gets a 30-minute walkthrough.
3. Default in your PIM/CMS. If your platform supports it, configure default alt text patterns that auto-populate from product attributes (brand + name + first variant). Authors override only when needed.
4. Audit weekly. Catch regressions before they accumulate. The longer bad alt text sits, the harder it is to retrofit.
5. Review quarterly. Spot-check new categories or campaigns that might not match existing patterns.

Bottom Line

Alt text isn't an accessibility chore — it's free image search SEO and a measurable WCAG win. The barrier is consistency, not difficulty. Adopt a pattern-driven style guide, train the team, audit weekly. Six months from now, your catalog will be one of the few ecommerce sites that gets alt text right, and you'll see the difference in image search referrals and accessibility audit scores.