Good Examples
- "Blue gradient hero banner with white headline text"
- "Woman holding stainless steel bottle in gym"
- "Dashboard line chart showing week-over-week growth"
Accessibility + SEO
Good alt text helps screen readers, improves accessibility compliance, and gives search engines clearer context for image meaning.
Simple template:
[Subject] + [Action/Context] + [Important visual detail]
Example: "Red running shoes on white background, side profile view"
| Image Type | What to Do | Example |
|---|---|---|
| Decorative background | Use empty alt | alt="" |
| Product photo | Describe item and key visual detail | "Matte black water bottle with screw cap" |
| Chart or infographic | Summarize key takeaway | "Line chart showing monthly traffic growth from Jan to Jun" |
| Functional icon/button | Describe action, not appearance | "Search" or "Open menu" |
Step 1
Define the image purpose on the page before writing anything.
Step 2
Describe what is visibly true, not generic keywords.
Step 3
Keep phrasing concise and natural (usually 8-20 words).
Step 4
Avoid duplicate alt text across different images on the same page.
Explore related tools to keep your workflow fast and consistent.