seo-images

Audits webpage images for alt text, file size, format, lazy loading, and CLS issues.

Updated Mar 26, 2026
One-click install
npx skills add https://github.com/LGJ-Jonathan/Jonathan_Global_Claude_Skills --skill seo-images-lgj-jonathan
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: seo-images
Source: https://github.com/LGJ-Jonathan/Jonathan_Global_Claude_Skills/tree/main/claude-seo/skills/seo-images
Command: npx skills add https://github.com/LGJ-Jonathan/Jonathan_Global_Claude_Skills --skill seo-images-lgj-jonathan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Images are often the largest assets on a webpage and a common source of SEO and Core Web Vitals problems: missing alt text hurts accessibility and rankings, oversized files slow page loads, and missing dimensions cause layout shifts. This Skill audits a page's images against SEO and performance best practices and produces a prioritized fix list. ## Core Features & Use Cases - Alt Text Audit: Detects missing, non-descriptive, or keyword-stuffed alt attributes on all <img> elements. - Size & Format Analysis: Flags oversized images against tiered thresholds (thumbnails, content, hero) and recommends WebP/AVIF over JPEG/PNG with <picture> fallback patterns. - Performance Checks: Verifies responsive srcset/sizes, correct lazy loading (below-fold only), fetchpriority="high" on LCP images, decoding="async", and width/height attributes for CLS prevention. - Use Case: Run an image audit on a landing page before launch to find a 2MB hero PNG, five images missing alt text, and a lazy-loaded LCP image, then get a prioritized optimization list sorted by estimated byte savings. ## Quick Start Run an image optimization audit on https://example.com and list the biggest fixes first.

Frequently Asked Questions about seo-images

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit images on a webpage for SEO?

Run an image audit that fetches the page HTML and checks every img element for alt text quality, file size, format, dimensions, and loading attributes. The audit outputs a summary table of issues plus a prioritized optimization list sorted by estimated byte savings.

What image format should I use for websites?

Use WebP as the default (97%+ browser support) or AVIF for the best compression (92%+ support), with JPEG as a fallback for photos and PNG for transparency. Serve them via a picture element with source fallbacks so browsers pick the first supported format.

Should I lazy load my hero image?

No, never lazy-load above-the-fold or LCP images because it directly harms Largest Contentful Paint scores. Instead add fetchpriority="high" to the hero image and reserve loading="lazy" for below-the-fold images only.

How do I prevent layout shift from images?

Set explicit width and height attributes on every img element, or use the CSS aspect-ratio property as an alternative. This lets the browser reserve space before the image loads, preventing Cumulative Layout Shift.

What makes good alt text for image SEO?

Good alt text describes the image content in 10-125 characters with natural keyword use, like "Red 2024 Toyota Camry sedan front view". Avoid filenames like "image.jpg", keyword stuffing, and non-descriptive text like "Click here".

What happens if the audit cannot access images on a page?

If a URL is unreachable, the audit reports the connection error and status code. If images sit behind a CDN or authentication, it reports available markup metadata (alt text, dimensions, format) and flags the inaccessible resources.