/digital-marketing-pro:image-seo-audit
Purpose
Perform a dedicated image optimization audit that evaluates all images on a page or site for SEO, performance, and accessibility. Produces a prioritized optimization list sorted by file size impact.
Input Required
- URL: Page or site to audit
- Scope: Single page or site-wide crawl (default: single page)
Process
- Load brand context: Read active brand profile for industry context.
- Discover images: Find all
<img>, <picture>, CSS background-image, and <source> elements.
- Alt text audit: Check presence, quality, keyword inclusion, length (10-125 chars). Flag: missing, filename-only ("image.jpg"), keyword-stuffed, non-descriptive ("click here").
- File size audit: Apply tiered thresholds by image category — thumbnails (<50KB target, >200KB critical), content images (<100KB target, >500KB critical), hero/banner (<200KB target, >700KB critical).
- Format audit: Check for modern formats. Recommend WebP (97%+ support) or AVIF (92%+ support) over JPEG/PNG. Check for
<picture> element with format fallbacks. Note: JPEG XL restored in Chromium (Nov 2025) but not yet in Chrome stable — monitor, don't recommend yet.
- Responsive images: Check for
srcset and sizes attributes, appropriate resolution for device pixel ratios.
- Lazy loading: Verify
loading="lazy" on below-fold images. Flag loading="lazy" on above-fold/hero images (directly harms LCP).
- fetchpriority: Check for
fetchpriority="high" on LCP/hero images. Check for decoding="async" on non-LCP images.
- CLS prevention: Check for
width and height attributes or aspect-ratio CSS on all <img> elements. Flag images without dimensions.
- File naming: Check for descriptive, hyphenated, lowercase file names vs generic names (IMG_1234.jpg).
- CDN usage: Check if images are served from a CDN (different domain, CDN headers, edge caching).
- Score and prioritize: Sort by file size savings impact (largest first).
Recommended Picture Element Pattern
<picture>
<source srcset="image.avif" type="image/avif">
<source srcset="image.webp" type="image/webp">
<img src="image.jpg" alt="Descriptive alt text" width="800" height="600" loading="lazy" decoding="async">
</picture>
Hero/LCP Image Pattern
<img src="hero.webp" fetchpriority="high" alt="Hero image description" width="1200" height="630">
Do NOT lazy-load above-fold/LCP images. Do NOT add decoding="async" to LCP images.
Output
Image Audit Summary
| Metric |
Status |
Count |
| Total Images |
— |
XX |
| Missing Alt Text |
issues |
XX |
| Oversized (>200KB) |
issues |
XX |
| Wrong Format (not WebP/AVIF) |
issues |
XX |
| No Dimensions (CLS risk) |
issues |
XX |
| Not Lazy Loaded (below-fold) |
issues |
XX |
| No fetchpriority on LCP |
issues |
XX |
Prioritized Optimization List
Sorted by estimated file size savings (largest first):
| Image |
Current Size |
Format |
Issues |
Est. Savings |
| hero.jpg |
450KB |
JPEG |
No WebP, no fetchpriority |
~300KB |
| ... |
... |
... |
... |
... |
Recommendations (prioritized)
- Convert X images to WebP format (est. XX KB total savings)
- Add alt text to X images
- Add width/height dimensions to X images
- Enable lazy loading on X below-fold images
- Add fetchpriority="high" to LCP image
- Compress X oversized images
- Implement
<picture> element with AVIF/WebP fallbacks
Agents Used
- seo-specialist — Image optimization analysis, CWV impact assessment
Scripts Used
- tech-seo-auditor.py — Fetch page and analyze image elements
1---2name: image-seo-audit3description: Audit image SEO. Use when: checking alt text, file sizes, WebP/AVIF formats, lazy loading, or responsive images.4---5
6# /digital-marketing-pro:image-seo-audit
7
8## Purpose
9
10Perform a dedicated image optimization audit that evaluates all images on a page or site for SEO, performance, and accessibility. Produces a prioritized optimization list sorted by file size impact.
11
12## Input Required
13
14- **URL**: Page or site to audit
15- **Scope**: Single page or site-wide crawl (default: single page)
16
17## Process
18
191. **Load brand context**: Read active brand profile for industry context.
202. **Discover images**: Find all `<img>`, `<picture>`, CSS `background-image`, and `<source>` elements.
213. **Alt text audit**: Check presence, quality, keyword inclusion, length (10-125 chars). Flag: missing, filename-only ("image.jpg"), keyword-stuffed, non-descriptive ("click here").
224. **File size audit**: Apply tiered thresholds by image category — thumbnails (<50KB target, >200KB critical), content images (<100KB target, >500KB critical), hero/banner (<200KB target, >700KB critical).
235. **Format audit**: Check for modern formats. Recommend WebP (97%+ support) or AVIF (92%+ support) over JPEG/PNG. Check for `<picture>` element with format fallbacks. Note: JPEG XL restored in Chromium (Nov 2025) but not yet in Chrome stable — monitor, don't recommend yet.
246. **Responsive images**: Check for `srcset` and `sizes` attributes, appropriate resolution for device pixel ratios.
257. **Lazy loading**: Verify `loading="lazy"` on below-fold images. Flag `loading="lazy"` on above-fold/hero images (directly harms LCP).
268. **fetchpriority**: Check for `fetchpriority="high"` on LCP/hero images. Check for `decoding="async"` on non-LCP images.
279. **CLS prevention**: Check for `width` and `height` attributes or `aspect-ratio` CSS on all `<img>` elements. Flag images without dimensions.
2810. **File naming**: Check for descriptive, hyphenated, lowercase file names vs generic names (IMG_1234.jpg).
2911. **CDN usage**: Check if images are served from a CDN (different domain, CDN headers, edge caching).
3012. **Score and prioritize**: Sort by file size savings impact (largest first).
31
32## Recommended Picture Element Pattern
33
34```html
35<picture>
36 <source srcset="image.avif" type="image/avif">
37 <source srcset="image.webp" type="image/webp">
38 <img src="image.jpg" alt="Descriptive alt text" width="800" height="600" loading="lazy" decoding="async">
39</picture>
40```
41
42## Hero/LCP Image Pattern
43
44```html
45<img src="hero.webp" fetchpriority="high" alt="Hero image description" width="1200" height="630">
46```
47
48Do NOT lazy-load above-fold/LCP images. Do NOT add `decoding="async"` to LCP images.
49
50## Output
51
52### Image Audit Summary
53
54| Metric | Status | Count |
55|--------|--------|-------|
56| Total Images | — | XX |
57| Missing Alt Text | issues | XX |
58| Oversized (>200KB) | issues | XX |
59| Wrong Format (not WebP/AVIF) | issues | XX |
60| No Dimensions (CLS risk) | issues | XX |
61| Not Lazy Loaded (below-fold) | issues | XX |
62| No fetchpriority on LCP | issues | XX |
63
64### Prioritized Optimization List
65
66Sorted by estimated file size savings (largest first):
67
68| Image | Current Size | Format | Issues | Est. Savings |
69|-------|-------------|--------|--------|-------------|
70| hero.jpg | 450KB | JPEG | No WebP, no fetchpriority | ~300KB |
71| ... | ... | ... | ... | ... |
72
73### Recommendations (prioritized)
741. Convert X images to WebP format (est. XX KB total savings)
752. Add alt text to X images
763. Add width/height dimensions to X images
774. Enable lazy loading on X below-fold images
785. Add fetchpriority="high" to LCP image
796. Compress X oversized images
807. Implement `<picture>` element with AVIF/WebP fallbacks
81
82## Agents Used
83
84- **seo-specialist** — Image optimization analysis, CWV impact assessment
85
86## Scripts Used
87
88- **tech-seo-auditor.py** — Fetch page and analyze image elements
majiayu000