Тяжёлые PNG тормозят загрузку лендинга? PNG в WebP уменьшает размер при сохранении визуального качества — фиксированное качество 85, без регистрации и без Photoshop.
Зачем WebP на сайте
- Меньший вес, чем у PNG при сопоставимой картинке.
- Поддержка прозрачности (в отличие от JPEG).
- Современные браузеры отображают WebP нативно.
Для старых браузеров на практике оставляют <picture> с PNG-запасом — WebP грузят как основной источник.
Пошагово
- Подготовьте PNG в целевом разрешении (не загружайте 4000px, если на странице 800px).
- Откройте PNG в WebP.
- Загрузите файл (до 25 МБ).
- Встройте
.webpв вёрстку или CMS, проверьте LCP в PageSpeed.
Обратная конвертация для правок — WebP в PNG.
PNG, WebP и JPEG на одном проекте
| Формат | Где уместен |
|---|---|
| WebP | Герои, иллюстрации, UI с прозрачностью |
| JPEG | Фото без прозрачности — PNG в JPEG |
| PNG | Запасной fallback, мелкая графика с идеальными краями |
Агрессивное сжатие всех ассетов — сжать фото для JPG-ориентированного пайплайна.
SEO и скорость
Поисковики учитывают Core Web Vitals. Лёгкие изображения улучшают LCP, особенно на мобильных сетях. Имена файлов и alt остаются на стороне вёрстки — конвертер меняет только формат.
