How to Add Alt Text to Images

Alt text is the written description attached to an image on your website. You can’t see it on the page. Your visitors probably don’t know it exists. And it might be one of the most consistently neglected things across every site we audit — including, full disclosure, our own.

Quick Links:

• What Is Alt Text?
• Why It Matters
• How to Write Good Alt Text
  • WordPress
  • Shopify
  • Magento
  • Social Media
• Common Mistakes
• FAQ

What Is Alt Text?

Alt text (short for alternative text) is an HTML attribute that describes what’s in an image. It lives inside the image tag and looks like this:

<img src=”product-photo.jpg” alt=”6.5mm Creedmoor chamber reamer with carbide pilot” />

Three things use it: screen readers for visually impaired users, search engines trying to understand your content, and browsers when an image fails to load. If your image doesn’t load and there’s no alt text, your visitor sees a broken image icon and nothing else. Not ideal.

Why It Matters

Accessibility

About 7 million Americans have a visual disability. Screen readers — the software they use to navigate the web — read alt text aloud in place of images. When your alt text is missing or says something like “IMG_4823.jpg,” you’ve essentially removed a chunk of your website for an entire group of users. Beyond being the right thing to do, it’s increasingly a legal one: ADA compliance for websites is a growing area of litigation, and missing alt text is one of the most common flags.

SEO

Google can’t see images. It reads alt text to understand what an image shows and how it relates to the surrounding content. Well-written alt text helps your images show up in Google Image Search (real traffic, often overlooked), reinforces your page’s topic to the algorithm, and contributes to overall on-page SEO signals.

AI search

AI engines like ChatGPT, Perplexity, and Google’s AI Overviews parse page content to pull direct answers. Images with clear, descriptive alt text give those engines more context about what your page covers — which means more surface area for your content to get cited.

A real example

We work with a precision manufacturing client that sells highly technical products with very specific names. When we audited their site, we found that alt text was being auto-generated from file names — which meant a product called the “6 Dasher XNC Alpha Brass Chamber Reamer” was showing up in the code as just “6 Dasher XNC.” Half the product name. None of the context. That’s not just an alt text problem — it’s a search visibility problem. A customer searching for that specific reamer might never find it, because the page doesn’t actually say the full product name anywhere Google can read it.

The fix wasn’t complicated. It just required someone to go back through every product image and update the alt text manually. No plugin could do it. It had to be intentional.

How to Write Good Alt Text

The goal is to describe the image clearly and specifically — what it shows, what it’s of, what context it provides. Not to stuff keywords. Not to write a novel. Just a clear, accurate description.

The formula: What is it + relevant context

For product images:

• ❌ alt=”reamer”
• ❌ alt=”6 Dasher XNC”
• ✅ alt=”6 Dasher XNC Alpha Brass Chamber Reamer with carbide pilot”

For blog/editorial images:

• ❌ alt=”woman on laptop”
• ❌ alt=”marketing”
• ✅ alt=”Marketing strategist reviewing campaign data on laptop”

For decorative images (backgrounds, dividers, purely aesthetic elements): Use an empty alt attribute: alt=””. This tells screen readers to skip it. Don’t leave it out entirely — that’s different from intentionally leaving it blank.

For infographics or charts: Describe what the data shows, not just what type of chart it is.

• ❌ alt=”bar chart”
• ✅ alt=”Bar chart showing 40% increase in qualified leads after fractional CMO engagement”

Length: Aim for under 125 characters. Screen readers cut off around there.

Keywords: Include them when they’re naturally part of the description. Don’t force them in. “Custom-fit Jeep Wrangler trunk liner in black” is good alt text that happens to include keywords. “Jeep Wrangler trunk liner buy now hatchbag cargo liner custom” is keyword stuffing and helps no one.

How to Add Alt Text in WordPress

In the Block Editor (Gutenberg):

1. Click the image block
2. In the right sidebar, find the Alt Text field under Settings
3. Type your description
4. Save/update the post

In the Media Library:

1. Go to Media → Library
2. Click any image to open its details
3. Find the Alternative Text field
4. Add your description
5. Save

This is useful for retroactively updating alt text across your site — you don’t have to go post by post. Go to the Media Library, sort by date or filter by type, and work through images that have empty or auto-generated alt text.

Audit tip: Our go-to for finding missing alt text is the SE Ranking site audit — it flags images with no alt text as an issue and shows you exactly which pages they’re on. Yoast SEO also surfaces this in its content analysis. If you don’t have either, a free tool like Screaming Frog will crawl your site and export a list of every image with missing alt text.

How to Add Alt Text in Shopify

For product images:

1. Go to Products and open the product
2. Click on the product image
3. A dialog box will appear with an Add alt text field
4. Type your description
5. Click Save

Do this for every image on the product — main image and any additional gallery images. Each one gets its own alt text.

For theme/page images:

1. Go to Online Store → Themes
2. Click Customize
3. Click on any image section in the editor
4. Find the Image alt text or Alt text field in the left panel
5. Add your description

For blog post images:

1. Open the blog post in the editor
2. Click the image
3. Click the pencil/edit icon
4. Add alt text in the dialog that appears

At scale: Shopify doesn’t have a bulk alt text editor natively. If you have a large product catalog with missing alt text, a third-party app like Image SEO or Smart SEO can help you manage this at scale. You can also export your product data, update alt text in a spreadsheet, and reimport — but that requires some technical comfort.

How to Add Alt Text in Magento

Magento handles alt text at the product level, which is good news — it means updating it for one product updates it everywhere that product appears.

For product images:

1. Go to Catalog → Products
2. Open the product
3. Scroll to the Images and Videos section
4. Hover over the image you want to update
5. Click the pencil icon
6. Fill in the Alt Text field
7. Save

For CMS page and block images:

1. Go to Content → Pages (or Blocks)
2. Open the content in edit mode
3. In the WYSIWYG editor, click on the image
4. Click the Insert/Edit Image icon
5. Update the Image Description field (this is alt text)
6. Save

At scale: For large catalogs, use Magento’s import/export functionality. Export your product data, add alt text in bulk in a spreadsheet, and reimport. It’s the most efficient way to handle hundreds of products. Same principle applies here as everywhere else: prioritize your top-traffic and top-converting pages first.

How to Add Alt Text on Social Media

Alt text isn’t just a website thing. Most social platforms now support it, and it matters for the same reasons — accessibility and algorithmic context.

Instagram: When posting, tap Advanced Settings before sharing → Write Alt Text → add your description → Save. For existing posts: tap the three dots → Edit → Edit Alt Text.

Facebook: When uploading an image, click Edit on the photo → Alternative Text → choose Custom alt text → write your description.

LinkedIn: When adding an image to a post, click the pencil icon on the image → add alt text in the field that appears.

X (Twitter): When adding an image, click + ALT in the bottom corner of the image preview → write your description (420 character limit) → Save.

Twitter/X has one of the higher character limits for alt text — use it. Describe what’s in the image specifically, especially if it includes text, charts, or data that’s meaningful to the post.

Common Mistakes to Avoid

Leaving it blank. The most common mistake. Screen readers skip the image entirely. Search engines get nothing. Fix it.

Using the file name as alt text. A lot of platforms auto-populate alt text from the file name if you don’t add one manually. “IMG_4823” and “product-photo-final-v3” are not alt text. Neither is “6-dasher-xnc.jpg.” Name your files descriptively before uploading, and add alt text separately.

Starting with “image of” or “photo of.” Screen readers already announce that it’s an image. “Image of a chamber reamer” → just “chamber reamer.” Skip the preamble.

Keyword stuffing. alt=”chamber reamer chamber reamer buy chamber reamer gunsmithing tools reamer” is not alt text. It’s spam. Google treats it as such.

Writing the same alt text for every image. If every image on your product page has the same alt text, something is wrong. Each image shows something slightly different — describe what’s actually in it.

Skipping decorative images. Decorative images should have alt=”” (empty, not missing). If the attribute is missing entirely, some screen readers will read the file name aloud, which is confusing and unhelpful.

Forgetting about it on social media. Most people don’t know social platforms support alt text. Now you do. Use it.

Frequently Asked Questions

What is alt text? Alt text is a written description of an image embedded in the HTML of a webpage. It’s used by screen readers for visually impaired users, by search engines to understand image content, and by browsers when images fail to load. Adding it is both an accessibility best practice and an SEO one.

Does alt text affect SEO? Yes, directly. Google uses alt text to understand what images show and how they relate to surrounding content. It also determines whether your images appear in Google Image Search. Well-written alt text with natural keyword inclusion reinforces your page’s relevance for target search terms.

How long should alt text be? Under 125 characters. Screen readers typically cut off around that point. Be specific and descriptive within that limit — you don’t need to write a sentence for every image, but “product photo” is not enough.

Should every image have alt text? Every meaningful image should. Purely decorative images (backgrounds, dividers, design elements) should have an empty alt attribute (alt=””) rather than a description, so screen readers skip them without confusion.

What’s the difference between alt text and image title? Alt text describes the image for accessibility and SEO purposes. The image title is a tooltip that appears when a user hovers over the image — it’s a nice-to-have, not a necessity. Prioritize alt text.

Can I add alt text to images on social media? Yes. Instagram, Facebook, LinkedIn, and X all support alt text on images. It’s not added by default — you have to opt in. It’s worth doing both for accessibility and to give the platform’s algorithm more context about your content.

What happens if I don’t add alt text to product images? A few things: visually impaired users can’t understand what the product looks like. Search engines get less context about your products, which can hurt your visibility in both regular and image search. And if the image ever fails to load, customers see nothing where the image should be.

It’s one of those things that’s easy to skip because it’s invisible. Nobody’s going to complain out loud that your alt text is missing — they’ll just quietly have a worse experience, and Google will quietly give your competitor a small edge.

Neither outcome is great. Fortunately, neither takes very long to fix.If you’d rather hand this off to someone who will actually do it, that’s what we’re here for.