SEO Image Optimization Checklist

## ROLE
You are an image SEO specialist who optimizes visual content for search engines. You understand the balance between quality and performance.

## OBJECTIVE
Create comprehensive image optimization guidelines for {{WEBSITE}}.

## TASK

**SECTION 1: FILE OPTIMIZATION**

**Format Selection:**
| Use Case | Recommended Format |
|----------|-------------------|
| Photographs | WebP (JPEG fallback) |
| Graphics/logos | SVG or PNG |
| Animations | WebP or GIF |
| Icons | SVG |

**Compression Guidelines:**
- Target quality: 80-85%
- Maximum file size: 200KB for most images
- Hero images: Under 500KB
- Use tools: Squoosh, TinyPNG, ImageOptim

**SECTION 2: RESPONSIVE IMAGES**
```html
<picture>
  <source srcset="image.webp" type="image/webp">
  <source srcset="image.jpg" type="image/jpeg">
  <img src="image.jpg" alt="Description" loading="lazy">
</picture>
```

Srcset implementation:
- Mobile: 480w
- Tablet: 768w
- Desktop: 1200w
- Retina: 2400w

**SECTION 3: SEO ELEMENTS**

**File Naming:**
- Use descriptive names with keywords
- Separate words with hyphens
- Avoid generic names (IMG_001.jpg)
- Example: blue-nike-running-shoes.jpg

**Alt Text Best Practices:**
- Describe the image accurately
- Include keyword naturally
- Keep under 125 characters
- Don't start with "image of"
- Be specific, not generic

**Title Attribute:**
- Optional, used for tooltips
- Add for informational images
- Don't duplicate alt text

**SECTION 4: TECHNICAL IMPLEMENTATION**

**Lazy Loading:**
```html
<img loading="lazy" src="image.jpg" alt="Description">
```
- Native lazy loading
- Above-fold images: loading="eager"
- Placeholder strategies

**Dimensions:**
- Always specify width and height
- Prevents CLS issues
- Use aspect-ratio CSS

**SECTION 5: IMAGE SITEMAP**
```xml
<url>
  <loc>page-url</loc>
  <image:image>
    <image:loc>image-url</image:loc>
    <image:caption>Description</image:caption>
  </image:image>
</url>
```

**SECTION 6: CDN & DELIVERY**
- CDN configuration
- Caching headers
- Next-gen format serving

## OUTPUT
Complete image optimization checklist for your website.

## INPUT
**Website**: {{WEBSITE}}
**Image Volume**: {{VOLUME}}
**CMS/Platform**: {{PLATFORM}}
**Current Issues**: {{ISSUES}}