seo-images▌
agricidaniel/claude-seo · updated Apr 8, 2026
MDX-style export adds YAML metadata + attribution linking explainx.ai and this canonical listing URL.
Good examples:
Image Optimization Analysis
Checks
Alt Text
- Present on all
<img>elements (except decorative:role="presentation") - Descriptive: describes the image content, not "image.jpg" or "photo"
- Includes relevant keywords where natural, not keyword-stuffed
- Length: 10-125 characters
Good examples:
- "Professional plumber repairing kitchen sink faucet"
- "Red 2024 Toyota Camry sedan front view"
- "Team meeting in modern office conference room"
Bad examples:
- "image.jpg" (filename, not description)
- "plumber plumbing plumber services" (keyword stuffing)
- "Click here" (not descriptive)
File Size
Tiered thresholds by image category:
| Image Category | Target | Warning | Critical |
|---|---|---|---|
| Thumbnails | < 50KB | > 100KB | > 200KB |
| Content images | < 100KB | > 200KB | > 500KB |
| Hero/banner images | < 200KB | > 300KB | > 700KB |
Recommend compression to target thresholds where possible without quality loss.
Format
| Format | Browser Support | Use Case |
|---|---|---|
| WebP | 97%+ | Default recommendation |
| AVIF | 92%+ | Best compression, newer |
| JPEG | 100% | Fallback for photos |
| PNG | 100% | Graphics with transparency |
| SVG | 100% | Icons, logos, illustrations |
Recommend WebP/AVIF over JPEG/PNG. Check for <picture> element with format fallbacks.
Recommended <picture> Element Pattern
Use progressive enhancement with the most efficient format first:
<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>
The browser will use the first supported format. Current browser support: AVIF 93.8%, WebP 95.3%.
JPEG XL: Emerging Format
In November 2025, Google's Chromium team reversed its 2022 decision and announced it will restore JPEG XL support in Chrome using a Rust-based decoder. The implementation is feature-complete but not yet in Chrome stable. JPEG XL offers lossless JPEG recompression (~20% savings with zero quality loss) and competitive lossy compression. Not yet practical for web deployment, but worth monitoring for future adoption.
Responsive Images
srcsetattribute for multiple sizessizesattribute matching layout breakpoints- Appropriate resolution for device pixel ratios
<img
src="image-800.jpg"
srcset="image-400.jpg 400w, image-800.jpg 800w, image-1200.jpg 1200w"
sizes="(max-width: 600px) 400px, (max-width: 1200px) 800px, 1200px"
alt="Description"
>
Lazy Loading
loading="lazy"on below-fold images- Do NOT lazy-load above-fold/hero images (hurts LCP)
- Check for native vs JavaScript-based lazy loading
<!-- Below fold - lazy load -->
<img src="photo.jpg" loading="lazy" alt="Description">
<!-- Above fold - eager load (default) -->
<img src="hero.jpg" alt="Hero image">
fetchpriority="high" for LCP Images
Add fetchpriority="high" to your hero/LCP image to prioritize its download in the browser's network queue:
<img src="hero.webp" fetchpriority="high" alt="Hero image description" width="1200" height="630">
Critical: Do NOT lazy-load above-the-fold/LCP images. Using loading="lazy" on LCP images directly harms LCP scores. Reserve loading="lazy" for below-the-fold images only.
decoding="async" for Non-LCP Images
Add decoding="async" to non-LCP images to prevent image decoding from blocking the main thread:
<img src="photo.webp" alt="Description" width="600" height="400" loading="lazy" decoding="async">
CLS Prevention
widthandheightattributes set on all<img>elementsaspect-ratioCSS as alternative- Flag images without dimensions
<!-- Good - dimensions set -->
<img src="photo.jpg" width="800" height="600" alt="Description">
<!-- Good - CSS aspect ratio -->
<img src="photo.jpg" style="aspect-ratio: 4/3" alt="Description">
<!-- Bad - no dimensions -->
<img src="photo.jpg" alt="Description">
File Names
- Descriptive:
blue-running-shoes.webpnotIMG_1234.jpg - Hyphenated, lowercase, no special characters
- Include relevant keywords
CDN Usage
- Check if images served from CDN (different domain, CDN headers)
- Recommend CDN for image-heavy sites
- Check for edge caching headers
Output
Image Audit Summary
| Metric | Status | Count |
|---|---|---|
| Total Images | - | XX |
| Missing Alt Text | ❌ | XX |
| Oversized (>200KB) | ⚠️ | XX |
| Wrong Format | ⚠️ | XX |
| No Dimensions | ⚠️ | XX |
| Not Lazy Loaded | ⚠️ | XX |
Prioritized Optimization List
Sorted by file size impact (largest savings first):
| Image | Current Size | Format | Issues | Est. Savings |
|---|---|---|---|---|
| ... | ... | ... | ... | ... |
Recommendations
- Convert X images to WebP format (est. XX KB savings)
- Add alt text to X images
- Add dimensions to X images
- Enable lazy loading on X below-fold images
- Compress X oversized images
Image SERP Analysis
When DataForSEO MCP is available, enhance the image audit with competitive data.
/seo images serp <keyword>
Cross-reference on-page images with Google Images SERP rankings.
Workflow:
- Fetch Google Images results via
serp_google_images_live_advanced(depth=100) - Extract: top domains, image types, alt text patterns
- Output competitor image SERP landscape
Output:
| Rank | Domain | Title/Alt | Image URL | Page URL |
|---|---|---|---|---|
| 1 | example.com | "Blue running shoes..." | .../shoes.webp | /products/... |
Analysis includes:
- Domain dominance: which sites own the most image positions (top 10 by count)
- Alt text patterns: common title/alt patterns in top-ranking images
- Format distribution: WebP vs JPEG vs PNG in top results
- Opportunity score: keywords where you have page rankings but no image presence
If DataForSEO MCP is not available, inform user and suggest installing the extension.
Image File Optimization
Optimize image files for SEO: format conversion, metadata injection, compression.
/seo images optimize <path>
Optimize image file(s) for web and SEO. Converts to WebP/AVIF, injects IPTC metadata, compresses, and generates responsive variants.
Tools used (in order of preference):
exiftool-- EXIF/IPTC/XMP read/write (install:sudo apt install libimage-exiftool-perl)cwebp-- WebP conversion (install:sudo apt install webp)- ImageMagick
convert-- Format conversion, resizing (pre-installed on most systems) - FFmpeg -- Fallback for format conversion (pre-installed)
Before running: Check which tools are available with which exiftool cwebp convert ffmpeg.
Format Conversion
Convert images to modern formats with metadata preservation:
# WebP (recommended default) - with metadata preserved
cwebp -q 82 -metadata all input.jpg -o output.webp
# WebP via ImageMagick (fallback if cwebp not installed)
convert input.jpg -quality 82 output.webp
# AVIF via FFmpeg (slower encode, best compression)
ffmpeg -i input.jpg -c:v libaom-av1 -crf 30 -still-picture 1 output.avif
# Responsive variants (400w, 800w, 1200w)
convert input.jpg -resize 400x -quality 82 image-400.webp
convert input.jpg -resize 800x -quality 82 image-800.webp
convert input.jpg -resize 1200x -quality 82 image-1200.webp
Metadata Injection (IPTC for Google Rich Results)
Google Images displays IPTC Creator, Credit Line, and Copyright in search results. This is NOT a ranking factor but improves rich result display and brand attribution.
With exiftool (preferred):
# Read all metadata
exiftool image.jpg
# Inject IPTC + XMP metadata for Google Images rich results
exiftool \
-IPTC:ObjectName="Product Photo Description" \
-IPTC:Caption-Abstract="Detailed image description" \
-IPTC:By-line="Brand Name Photography" \
-IPTC:CreditHow to use seo-images on Cursor
AI-first code editor with Composer
Prerequisites
Before installing skills in Cursor, ensure your development environment meets these requirements:
- ›Cursor installed and configured on your development machine
- ›Node.js version 16.0+ with npm package manager (verify with
node --version) - ›Active project directory or workspace where you want to add seo-images
Execute installation command
Execute the skills CLI command in your project's root directory to begin installation:
The skills CLI fetches seo-images from GitHub repository agricidaniel/claude-seo and configures it for Cursor.
Select Cursor when prompted
The CLI will show a list of available agents. Use arrow keys to navigate and space to select Cursor:
Verify installation
Confirm successful installation by checking the skill directory location:
Reload or restart Cursor to activate seo-images. Access the skill through slash commands (e.g., /seo-images) or your agent's skill management interface.
Security & Verification Notice
We perform automated surface-level scans (Gen AI Scanner, Socket, Snyk) during installation. These checks detect common vulnerabilities but do not guarantee complete security. Always review skill source code and verify the publisher's reputation before production use.
Skills execute code in your development environment. Always verify the publisher's identity, review recent commits, and test in isolated environments before production deployment.
List & Monetize Your Skill
Submit your Claude Code skill and start earning
Use Cases▌
Task Automation & Efficiency
Automate repetitive workflows and reduce manual effort
Example
Generate reports, summarize documents, draft communications
Save 3-5 hours per week on routine tasks
Knowledge Enhancement
Learn new skills, understand complex topics, get expert guidance
Example
Explain concepts, provide examples, suggest learning resources
Accelerate learning and skill development by 2x
Quality Improvement
Enhance output quality through reviews, suggestions, and refinements
Example
Review drafts, suggest improvements, catch errors
Improve work quality by 30-40% with less effort
Implementation Guide▌
Prerequisites
- ›Claude Desktop or compatible AI client with skill support
- ›Clear understanding of task or problem to solve
- ›Willingness to iterate and refine outputs
Time Estimate
15-45 minutes depending on use case complexity
Installation Steps
- 1.Install skill using provided installation command
- 2.Test with simple use case relevant to your work
- 3.Evaluate output quality and relevance
- 4.Iterate on prompts to improve results
- 5.Integrate into regular workflow if valuable
Common Pitfalls
- ⚠Expecting perfect results without iteration
- ⚠Not providing enough context in prompts
- ⚠Using skill for tasks outside its intended scope
- ⚠Accepting outputs without review and validation
Best Practices▌
✓ Do
- +Start with clear, specific prompts
- +Provide relevant context and constraints
- +Review and refine all outputs before using
- +Iterate to improve output quality
- +Document successful prompt patterns
✗ Don't
- −Don't use without understanding skill limitations
- −Don't skip validation of outputs
- −Don't share sensitive information in prompts
- −Don't expect skill to replace human judgment
💡 Pro Tips
- ★Be specific about desired format and style
- ★Ask for multiple options to choose from
- ★Request explanations to understand reasoning
- ★Combine AI efficiency with human expertise
When to Use This▌
✓ Use When
Use when skill capabilities match your task, clear ROI on time saved, and you can validate outputs. Best for repetitive tasks, learning, and quality improvement.
✗ Avoid When
Avoid when task requires deep expertise you can't validate, involves sensitive decisions, or when learning process is more valuable than speed of completion.
Learning Path▌
- 1Familiarize yourself with skill capabilities and limitations
- 2Start with low-risk, non-critical tasks
- 3Progress to more complex and valuable use cases
- 4Build expertise through regular use and experimentation
Discussion
Product Hunt–style comments (not star reviews)- No comments yet — start the thread.
Ratings
4.5★★★★★28 reviews- ★★★★★Shikha Mishra· Dec 12, 2024
seo-images reduced setup friction for our internal harness; good balance of opinion and flexibility.
- ★★★★★Hiroshi Choi· Nov 23, 2024
Keeps context tight: seo-images is the kind of skill you can hand to a new teammate without a long onboarding doc.
- ★★★★★Sakshi Patil· Nov 11, 2024
seo-images is among the better-maintained entries we tried; worth keeping pinned for repeat workflows.
- ★★★★★Yash Thakker· Nov 3, 2024
I recommend seo-images for anyone iterating fast on agent tooling; clear intent and a small, reviewable surface area.
- ★★★★★Dhruvi Jain· Oct 22, 2024
Useful defaults in seo-images — fewer surprises than typical one-off scripts, and it plays nicely with `npx skills` flows.
- ★★★★★Naina Abbas· Oct 14, 2024
seo-images is among the better-maintained entries we tried; worth keeping pinned for repeat workflows.
- ★★★★★Chaitanya Patil· Oct 2, 2024
Keeps context tight: seo-images is the kind of skill you can hand to a new teammate without a long onboarding doc.
- ★★★★★Ama Martinez· Sep 25, 2024
Solid pick for teams standardizing on skills: seo-images is focused, and the summary matches what you get after install.
- ★★★★★Oshnikdeep· Sep 13, 2024
seo-images has been reliable in day-to-day use. Documentation quality is above average for community skills.
- ★★★★★Hana Lopez· Aug 20, 2024
seo-images reduced setup friction for our internal harness; good balance of opinion and flexibility.
showing 1-10 of 28