Image Optimization

This one brings together Google's image SEO guidance with Core Web Vitals performance basics in one pass. It covers the full stack: discovery through HTML img elements and image sitemaps, format selection (WebP, AVIF, SVG), responsive images with srcset, lazy loading strategy, alt text best practices, and how to influence the thumbnail that appears next to your title in search results using primaryImageOfPage schema or og:image. The scope is practical. It separates above-fold hero images that need eager loading for LCP from below-fold content you can lazy load, walks through figcaption for context signals, and includes specific guidance on image dimensions for Google Discover. Good for landing pages, product pages, or any content where images carry SEO weight.

skills.sh installs: 1.2K
GitHub stars: 1.1K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add kostja94/marketing-skills --skill image-optimization --agent claude-code

Installs into .claude/skills of the current project.

Files

SEO On-Page: Image Optimization

Guides image optimization for Google Search (text results, Image Pack, Google Images, Discover), Core Web Vitals (LCP), and accessibility. Consolidates image-related best practices from components (hero, trust-badges) and pages (landing-page). References: Google Image SEO, Semrush Image SEO.

When invoking: On first use, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On subsequent use or when the user asks to skip, go directly to the main output.

Scope

Discovery & indexing: HTML img elements, image sitemap
Format & performance: WebP, responsive images, lazy loading, LCP; full CWV optimization in core-web-vitals
Metadata: Alt text, file names, captions
Preferred image: primaryImageOfPage, og:image; thumbnail next to title/description in search results
Structured data: ImageObject, image in Article/Product/etc.