# Image Optimization for SEO — SEO for Developers

Source: https://www.geekswithgeeks.com/en/seo-developers/seo-image-optimization

> Optimize images for both users and search engines.

## Image SEO best practices

Compress images, use descriptive filenames (`poodle-grooming-tips.jpg` not `image-1.jpg`), add alt text, use modern formats (WebP), and implement lazy loading to improve page speed and accessibility.

## Image markup and alt text

Always use descriptive alt text. It helps blind users understand images and helps Google index image search results.

```html
<!-- GOOD: Descriptive filename and alt text -->
<img 
  src="/images/chocolate-chip-cookie-recipe.jpg" 
  alt="Warm chocolate chip cookie fresh from the oven"
  width="400" 
  height="300"
  loading="lazy"
>

<!-- Using picture element for responsive images -->
<picture>
  <source media="(min-width: 768px)" srcset="large-image.webp">
  <source media="(min-width: 0px)" srcset="small-image.webp">
  <img src="fallback.jpg" alt="Descriptive text">
</picture>
```

## Responsive images with srcset

Use srcset to serve different image sizes for different screens. Saves bandwidth on mobile and improves LCP. Example: srcset="small.jpg 480w, medium.jpg 800w, large.jpg 1200w".

## Use modern formats: WebP and AVIF

WebP is 25% smaller than JPEG; AVIF is 30% smaller than WebP. Use <picture> element with fallbacks for older browsers.