Оптимизация изображений критична для скорости загрузки страницы. Основные методы:
1. **Выбор формата**:
- `WebP` – лучший баланс качества и размера (поддерживается в 98% браузеров)
- `AVIF` – для современных браузеров (лучшее сжатие)
- `JPEG` – для фото, если нужна совместимость
- `PNG` – для прозрачности/логотипов
2. **Сжатие**:
```html
```
3. **Ленивая загрузка**:
```html
```
4. **Ресайз под нужные размеры** – никогда не используйте CSS для масштабирования больших изображений.
5. **CDN с оптимизацией** (например, Cloudinary, Imgix) – они автоматически подбирают оптимальный формат.
Дополнительно: используйте `srcset` для респонсив-изображений, сжимайте через Squoosh.app или ImageOptim, удаляйте метаданные.
Разница между оптимизированным и неоптимизированным изображением может достигать 70-90% размера файла!