Writing Alt Text That Works for Both SEO and Accessibility
Alt text that works for both screen readers and SEO follows specific principles: contextual relevance, appropriate keyword inclusion without stuffing, and different approaches for different image types. Here's the craft behind writing alt text that does both jobs well.
By sadiqbd Β· June 8, 2026
Alt text that serves both SEO and accessibility is harder to write than most people think
The mechanical version β "describe what the image shows" β gets you partway there. But the alt text that performs well for both search ranking and screen reader users shares specific characteristics that go beyond simple description. The wrong approach gives you stuffed keyword lists that help no one, or vague generic descriptions that pass accessibility audits technically while failing users practically.
The two audiences for alt text
Screen reader users: the alt text is literally what they hear instead of seeing the image. "Image" or the filename is what they hear if alt text is missing β useless. A useful description tells them what the image contributes to the page content and why it's there.
Google Image Search: alt text is the primary signal for what an image depicts, affecting whether it ranks in image search results for relevant queries. Images in blog posts, product pages, and editorial content can drive meaningful traffic from Google Images β but only with descriptive, indexable alt text.
These audiences are not in conflict. Both need descriptive, accurate, contextually relevant alt text. The techniques that serve one serve the other.
The contextual specificity principle
Alt text should describe the image in the context of the surrounding content β not just generically.
Same image, different contexts:
Image: a person doing push-ups
On a personal training website's homepage: alt="Personal trainer demonstrating push-up form with straight back"
On a blog post about "upper body strength without equipment": alt="Push-up exercise targeting chest and triceps with proper straight-back form"
On an anatomy post about "muscles worked by push-ups": alt="Push-up exercise showing engaged chest, triceps, and anterior deltoid muscles"
The image is identical. The alt text is different because the page context is different. What matters isn't just what the image shows, but what it's communicating in this specific article.
When to include keywords β and when not to
Keywords belong in alt text when:
- They accurately describe what the image shows
- They're relevant to the page's topic
- Including them sounds natural in the description
Keywords don't belong when:
- They require stretching the description beyond what the image actually shows
- They're added after the genuine description as an afterthought (keyword stuffing)
- The image is decorative and shouldn't have descriptive alt text at all
Stuffed alt text (this is what not to do):
alt="best EMI calculator online free EMI calculator India loan calculator monthly payment EMI"
This describes nothing about the image and reads as obvious spam β to both screen readers and Google.
Keyword-appropriate alt text:
alt="EMI calculator showing monthly payment breakdown for a βΉ10 lakh home loan at 8.5% interest"
This describes the image, serves screen reader users, and naturally contains relevant terms. The keywords are there because they're accurate, not because they were inserted.
Alt text by image type
Product images
Include the product name, key distinguishing features, and colour/variant where visible:
alt="Leather briefcase in tan brown with dual brass buckles and shoulder strap"
Not: alt="briefcase" (too vague) or alt="briefcase bag leather tan brown satchel professional business bag" (stuffed).
Infographics
Describe the core information conveyed, not just that it's a chart or infographic:
alt="Bar chart showing 40% growth in renewable energy adoption across Europe from 2019 to 2023, with Germany and Spain leading"
Not: alt="infographic" or alt="energy chart".
Screenshots
Describe what's being shown in the interface:
alt="sadiqbd.com EMI Calculator showing βΉ15,967 monthly payment for a βΉ10 lakh loan at 9% interest over 7 years"
Not: alt="screenshot".
Team / person photos
Name the person and their role if relevant to the page context:
alt="Sarah Chen, Head of Product at Acme Corp, presenting at the 2024 product launch"
Not: alt="woman presenting".
Diagrams and technical illustrations
Describe what the diagram illustrates:
alt="Network architecture diagram showing load balancer routing traffic to three application servers connected to a shared database cluster"
Decorative images
Visual elements that don't add meaning β background textures, divider lines, purely ornamental icons β should use empty alt: alt="". Screen readers skip these entirely. Including descriptive text for decorative images creates noise for screen reader users navigating the page.
How to decide if an image is decorative: if you removed the image, would the user miss any information? If no, it's decorative.
Alt text length
No hard character limit, but practical guidance:
- Aim for 50β150 characters for most images
- 125 characters is a commonly cited soft limit based on screen reader behaviour
- Most important information in the first 80β100 characters
- Shorter is better when the description is complete; don't pad to hit a minimum
Too short: alt="dog" β lacks useful specificity for a contextual image
About right: alt="Golden retriever puppy playing fetch in a park, carrying a yellow tennis ball" β 77 characters, descriptive, complete
Too long: alt text that describes irrelevant background elements, includes the word "image of" or "photo of," or narrates tangential details
The "image of" and "photo of" prefix issue
Don't start alt text with "image of," "photo of," or "picture of." Screen readers already announce to users that they're encountering an image before reading the alt text. Starting with "image of" causes "image β image of golden retriever" to be announced, which is redundant. Start directly with the description.
How to use the Image Alt Checker on sadiqbd.com
- Enter the URL to audit
- Run the check β the tool identifies every
<img>tag on the page - Review:
- Images missing alt attribute entirely (highest priority to fix)
- Images with empty alt (check whether these are intentionally decorative or accidentally empty)
- Images with generic alt text ("image," filename, "photo")
- Prioritise fixes β product images and images in main content areas first; decorative images should get
alt=""
Frequently Asked Questions
What's the difference between empty alt (alt="") and missing alt (no alt attribute)?
Empty alt is correct for decorative images β screen readers skip it intentionally. Missing alt (no attribute at all) causes screen readers to fall back to reading the filename (IMG_20240610.jpg), which is unhelpful. Every image should have an alt attribute; whether it's empty or descriptive depends on whether the image is decorative.
Does alt text affect page rankings (not just image search rankings)? Yes β alt text contributes to the page's topical relevance signals. Images with relevant, descriptive alt text reinforce what the page is about. It's a secondary signal compared to headings and body text, but it's part of a comprehensive on-page optimisation approach.
How do I handle images with complex data (charts, graphs)? Provide a concise description in the alt text, and include the full data in visible text near the image (a caption or table). Alt text has a practical length limit; for complex data, the text alternative should appear on the page, not just in the alt attribute.
Is the Image Alt Checker free? Yes β completely free, no sign-up required.
Good alt text is specific to the context, describes what the image contributes to the page, and would be useful to someone who cannot see the image. Meeting that bar serves both accessibility and SEO without requiring any compromise between the two.
Try the Image Alt Checker free at sadiqbd.com β find every image on any page and identify which are missing or have inadequate alt text.