How to Add Alt Text to Images (SEO & Accessibility)
Learn how to add alt text to images for SEO and accessibility — with exact steps for WordPress, Wix, Squarespace, Webflow, Shopify and custom sites.
On this page
If ScoutRival’s SEO Score flagged “Add alt text to images,” it means some of your images are missing that short description search engines and screen readers rely on. It’s one of the easiest SEO and accessibility wins there is — usually a few minutes per page — and this guide walks you through it on every major platform, no coding required.
What is alt text?
Alt text (short for “alternative text”) is a written description attached to an image that describes what the image shows. It lives in the image’s alt attribute and is normally invisible to sighted visitors — but it does three important jobs behind the scenes: it’s read aloud by screen readers, it’s shown if the image fails to load, and it’s read by search engines that can’t actually “see” pictures.
Think of alt text like the caption a museum places beside a painting for a visitor who can’t see it clearly. The painting is the same, but the caption is what lets everyone understand what’s there. Your images look identical to sighted users whether or not they have alt text — but to a blind visitor, to Google, and to a browser with a broken image link, the alt text is the image.
In one sentence: alt text is a concise, human-readable description of an image that makes it understandable to screen readers, search engines, and any browser that can’t display it.
Why alt text matters for your SEO
Missing alt text won’t get your site penalised, but it quietly costs you in two ways:
- Lost image-search traffic. Google Images is a genuine traffic source — people search for products, recipes, examples and inspiration in images every day. Google reads your alt text to understand what an image contains and whether to show it for a query. No alt text means your images are far less likely to appear.
- Weaker accessibility signals. Search engines increasingly reward pages that are usable by everyone. Alt text is a core part of the Web Content Accessibility Guidelines (WCAG), and getting it right makes your whole page more accessible — which is both the right thing to do and a quality signal engines pay attention to.
There’s a bonus, too: with AI assistants now describing and citing web pages, clear alt text helps them understand what your images represent, making your content easier to surface in AI answers.
ScoutRival’s SEO Score checks what share of your meaningful images actually have alt text. This one is graded, not pass/fail — so every image you describe nudges the score up, and you don’t have to fix them all at once to see progress.
How to check if you have this problem
You can spot missing alt text in about 30 seconds without any tools:
- Open one of your key pages in a browser (Chrome, Edge or Firefox).
- Right-click an image and choose Inspect. In the panel that opens, look at the highlighted
<img>tag. - If you see an
alt="..."with a real description inside the quotes, that image is covered. If thealtattribute is missing entirely — or empty on an image that clearly matters — it needs fixing.
Prefer not to poke around in code? Install a free browser extension like WAVE or axe DevTools, run it on a page, and it will list every image missing alt text in plain English.
For the full picture across your whole site — not just one page — run a ScoutRival SEO Score. It scans your pages, tells you which ones have images missing alt text, and shows the coverage percentage so you know how much is left to do.
How to write good alt text
Before the platform steps, here’s the short recipe that applies everywhere:
- Describe what the image shows, briefly and specifically. “Golden retriever puppy sitting in a wicker basket” beats “puppy” or “IMG_2841”.
- Keep it concise — usually under about 125 characters. It’s a description, not a paragraph.
- Don’t keyword-stuff. Write for a person, not for Google. One or two natural keywords are fine if they genuinely describe the image.
- Skip “image of” or “picture of” — screen readers already announce that it’s an image.
- Use empty alt text (
alt="") for decorative images — spacers, background patterns, dividers — so screen readers skip past them instead of reading noise.
Here’s what a properly described image looks like in HTML:
<img src="team-photo.jpg" alt="Our design team collaborating at a whiteboard">
How to add alt text on any platform
Pick your platform below. Every path does the same thing: attaches a plain-English description to each image.
WordPress
WordPress makes this simple through the Media Library:
- Open the page or post in the editor, then click the image you want to describe.
- In the block settings on the right (or the media attachment panel), find the Alternative Text field.
- Type a short, accurate description and it saves automatically. To fix many at once, go to Media → Library, click any image, and fill in the Alt Text field there — it applies everywhere that image is used.
- If you use a page builder like Elementor or Divi, click the image widget and look for the Alt Text or Accessibility field in its settings.
Wix
- In the Wix Editor, click the image, then click the Settings icon (or Edit).
- Find the “What’s in the image? Tell Google” field — that’s the alt text box.
- Enter a clear description and it saves with the image. Repeat for each meaningful image, then Publish to push the changes live.
Squarespace
- Squarespace uses the image’s filename and caption for alt text, plus a dedicated field in newer setups. Click the image block, then Edit.
- Look for the image title / alt / accessibility field (in Image Blocks, add the description in the Filename / Alt Text area under the image settings).
- Alternatively, adding a caption set to “Do not display caption” still passes the text through as alt in many Squarespace layouts. Save, then confirm the description shows in the page’s underlying
<img>tag.
Webflow
- Select the image on the canvas, then open the Settings panel (the gear icon) on the right.
- In the Alt Text section, choose “Custom description” and type your alt text. (Choose “Decorative” for images that carry no meaning so Webflow outputs
alt="".) - For images added through the CMS, set the alt text on the image field in your CMS collection so every item inherits it. Click Publish when done.
Shopify
- In the admin, go to Content → Files (or open a product), click an image, and use the Add alt text option.
- For product images: open the product, click the image, and select Edit alt text (the “Alt” label appears on hover). Describe the product clearly — this feeds both accessibility and image search.
- For images inside your theme or blog posts, add alt text in the image editor when you insert them. Save the product or page to apply.
Any other website (custom or unlisted CMS)
If you hand-code your site or use a builder not listed above, add the attribute directly:
- Open the template or page containing the
<img>tag. - Add an
altattribute with a concise description to every meaningful image:
<img src="team-photo.jpg" alt="Our design team collaborating at a whiteboard">
- For purely decorative images, use
alt=""(an empty value, present but blank) so assistive tech skips them. Save and redeploy.
How to confirm it’s fixed
- Reload the page, right-click a fixed image → Inspect, and confirm the
<img>tag now contains youralt="..."description. - Re-run a free accessibility checker like WAVE on the page — the “missing alternative text” errors should be gone.
- Re-run your ScoutRival SEO audit. The “Add alt text to images” item’s coverage should climb, and your on-page pillar score should tick up as more images get described.
Common mistakes to avoid
- Keyword-stuffing the alt text. Cramming in “cheap shoes buy shoes running shoes discount shoes” reads as spam and can hurt you. Describe the image honestly.
- Writing “image of…” or “photo of…” — screen readers already say it’s an image, so you’re just adding clutter.
- Leaving the filename as the description. “DSC_0043.jpg” tells no one anything. Replace it with real words.
- Describing decorative images. A background swirl or a spacer line should have
alt="", not a description, so it doesn’t interrupt screen-reader users. - Forgetting images added later. Alt text isn’t a one-and-done task — add it every time you upload a new picture.
The bottom line
Alt text is a tiny bit of writing with an outsized payoff: it makes your site usable for people who rely on screen readers, opens the door to free image-search traffic, and helps search engines and AI assistants understand your visuals. Describe each meaningful image in a few honest words, mark decorative ones as empty, and you’ve cleared a genuinely easy win.
Want to know exactly which pages have images missing alt text? Run a free SEO Score with ScoutRival and get a prioritised, plain-English to-do list for your whole site. While you’re improving on-page signals, take a look at our guide to internal linking for SEO too.
Frequently asked questions
What is alt text and why does it matter?
How long should alt text be?
Do decorative images need alt text?
Does alt text help with SEO?
How do I add alt text in WordPress?
Should I put keywords in my alt text?
How do I check which images are missing alt text?
Nasir Uddin is an SEO consultant and ScoutRival's SEO & Growth Lead. He's spent years helping small businesses climb the search results — and now the AI answers too — and writes about SEO, AI-search visibility, and turning organic traffic into real growth.
Stop reading about it. Ship it this week.
ScoutRival turns competitor intel into ready-to-post content and graphics — for a fraction of an agency.