WebP Converter: Как преобразовать изображения в WebP (с реальными размерами)

Последнее обновление: June 27, 2026

Преобразование изображений в WebP — это одна из самых быстрых побед для производительности веб-страниц — WebP примерно на 25–35% меньше, чем JPEG, и намного меньше, чем PNG для одинакового контента, при поддержке браузеров около ~98%. В этом руководстве показано, как преобразовать изображения в WebP с ожидаемыми измеренными размерами файлов и как сохранить запасной вариант для браузеров, которым все еще нужен JPEG.

Быстрый ответ: как преобразовать в WebP?

Используйте командную строку cwebp для скорости и пакетной обработки, браузерный конвертер для разовых задач или Pillow для скриптов. На типичной фотографии преобразование JPEG в WebP при одинаковом качестве уменьшает размер файла примерно на ~30–45%.

Насколько на самом деле экономят WebP?

Измерено на одной фотографии размером 1400×933 пикселя, преобразованной с визуально соответствующим качеством:

Для графики PNG без потерь WebP обычно на 20–30% меньше, чем PNG при одинаковом качестве пикселей — это полезно для прозрачных элементов пользовательского интерфейса (UI). Один и тот же источник во всех четырех форматах делает разницу очевидной:

Полное сравнение форматов представлено в объяснении форматов изображений.

Стоит ли выбирать WebP или AVIF?

Оба формата меньше, чем JPEG; AVIF на 20–30% меньше, чем WebP, но кодируется он медленнее и имеет немного меньшую поддержку в браузерах. Практический ответ для большинства сайтов: использовать оба AVIF и WebP с запасным вариантом JPEG и позволить элементу <picture> предоставлять каждому браузеру то лучшее, что он поддерживает. Если вы можете добавить только один формат, WebP — более безопасный выбор, потому что он кодируется быстро и имеет более широкую поддержку. Когда будете готовы добавить AVIF, ознакомьтесь с сравнением AVIF и WebP.

Метод 1: Конвертер в браузере

Для одного изображения используйте Imagic AI Image Converter: загрузите, выберите WebP, установите качество около 80 для фотографий (или без потерь для графики) и скачайте. Для контроля качества/размера в реальном времени Squoosh показывает размер вывода при перемещении ползунка.

Метод 2: командная строка cwebp

cwebp — это официальный кодировщик WebP, быстрый и подходящий для скриптов.

## Lossy WebP from JPEG/PNG, quality 80
cwebp -q 80 input.jpg -o output.webp

## Lossless WebP (best for graphics, screenshots, sharp text)
cwebp -lossless input.png -o output.webp

## Resize to 1600px wide while converting
cwebp -q 80 -resize 1600 0 input.jpg -o output.webp

## A whole folder, in parallel
mkdir -p out
ls *.jpg | xargs -P 4 -I {} cwebp -q 80 {} -o out/{}.webp

Для декодирования обратно используется dwebp; magick от ImageMagick также считывает и записывает WebP, если вы уже используете этот инструмент. Подробности о паттерне параллельных папок см. в руководство по пакетному изменению размера.

Метод 3: Python (Pillow)

Для этапа сборки или сервера Pillow конвертирует и позволяет программно контролировать качество:

from PIL import Image
from pathlib import Path

def to_webp(src: Path, dest: Path, quality: int = 80, lossless: bool = False):
    with Image.open(src) as img:
        img.save(dest, "WebP", quality=quality, lossless=lossless, method=6)

for f in Path("images").glob("*"):
    if f.suffix.lower() in (".jpg", ".jpeg", ".png"):
        to_webp(f, Path("out") / f"{f.stem}.webp", quality=80)

method=6 обеспечивает самое медленное, но лучшее сжатие при кодировании — это нормально, если вы кодируете один раз при загрузке, а не при каждом запросе. Для графики без потерь (lossless) передайте lossless=True.

Как предоставить WebP с резервным вариантом?

Поддержка WebP составляет ~98%, но оставшиеся 2% (старый Safari, некоторые встроенные браузеры) требуют резервного варианта в формате JPEG/PNG. Используйте элемент <picture>:

<picture>
  <source srcset="/img/photo.webp" type="image/webp">
  <img src="/img/photo.jpg" alt="Description" width="800" height="600" loading="lazy">
</picture>

Браузер выбирает первый поддерживаемый им тип. Обязательно оставьте реальный тег <img> с src в формате JPEG в качестве окончательного резервного варианта, чтобы ничего не отображалось пустым. Если вы также генерируете AVIF, добавьте его как первый <source> — см. AVIF vs WebP comparison.

Какие настройки качества и метода следует использовать?

Для фотографий с потерями WebP оптимальным значением качества является 75–80 — это обеспечивает небольшие файлы без видимых потерь при нормальном расстоянии просмотра. Ниже 70 плавные градиенты и тона кожи начинают показывать артефакты; выше 85 вы тратите байты, которые глаз не может увидеть. Флаг -m (метод) обменивает время кодирования на меньший размер файлов: -m 0 — самый быстрый, а -m 6 — самый медленный, но дающий наименьший результат. Используйте -m 4 для интерактивной работы и -m 6 для одноразового пакетного кодирования, где скорость не имеет значения.

Для безпотерьного WebP (графика, скриншоты, четкий текст) комбинация -lossless -m 6 дает наилучшее соотношение; lossless WebP превосходит PNG примерно на 20–30% при одинаковом контенте. Если графика содержит очень мало цветов, также попробуйте сначала уменьшить палитру — меньшее количество цветов сжимается значительно лучше в любом безпотерьном формате. Эти детали настройки соответствуют более широким рекомендациям в глубоком погружении по сжатию изображений.

Когда WebP — это не лучший выбор?

• Электронная почта. Многие почтовые клиенты игнорируют WebP. Для электронной почты используйте JPEG/PNG.
• Старые встроенные браузеры (старые Smart TV, киоски), которые не поддерживают WebP.
• Ленты партнеров/маркетплейсов, которые принимают только JPEG.
• Когда конвейер инструментов не может его выдать. Если ваша CMS не может обслуживать <picture>, пайплайн, использующий только JPEG, будет проще, чем бороться с этим.

В таких случаях руководство по форматам format guide описывает правильную альтернативу.

Распространенные ошибки

• Конвертация, а не изменение размера. WebP с разрешением 4000px всё равно будет загрузкой в 4000px. Сначала измените размер.
• Использование WebP с потерями для чёткой графики. WebP с потерями размывает тонкие края, как это делает JPEG; используйте -lossless для скриншотов и текста.
• Предоставление WebP без запасного варианта (fallback). Старые браузеры ничего не отобразят без запасного варианта в виде JPEG <img>.
• Сравнение по одинаковому числу качества. В воспринимаемом качестве JPEG q85 ≈ WebP q80 ≈ AVIF q68; сравнивайте визуально, а не по числу.
• Избыточное кодирование при каждом запросе. Кодируйте один раз при загрузке; кодирование WebP медленнее, чем JPEG.

Часто задаваемые вопросы

Сколько на самом деле экономит WebP?

На 25–35% меньше, чем JPEG при равном качестве, и часто больше, чем PNG для графики с прозрачностью. Экономия — это причина конвертации для доставки в вебе. Сохраните оригинал как мастер; экспортируйте WebP для доставки.

Стоит ли выбирать WebP или AVIF?

WebP — безопасный вариант по умолчанию (универсальная поддержка браузеров, простая кодировка); AVIF — для самых маленьких файлов в современных браузерах (примерно на 50% меньше, чем JPEG, но медленнее кодируется и имеет пробелы в старых браузерах). Используйте AVIF с запасным вариантом WebP через элемент <picture>.

Что такое конвертация через командную строку?

cwebp -q 80 input.jpg -o output.webp. Флаг -q устанавливает качество (80 — это стандарт для веба). Выполняйте пакетно с помощью циклов оболочки или ImageMagick. Для без потерь используйте -lossless.

Все ли браузеры поддерживают WebP?

Все современные браузеры поддерживают. Очень старые браузеры (старый IE) — нет, поэтому вы подаете WebP с запасным вариантом JPEG или PNG через элемент <picture>. Запасной вариант покрывает небольшие оставшиеся пробелы.

Как мне конвертировать в WebP пачками?

Используйте цикл оболочки с cwebp (for f in *.jpg; do cwebp -q 80 "$f" -o "${f%.jpg}.webp"; done), ImageMagick или скрипт на Python (Pillow). Командная строка обрабатывает тысячи без ограничений на файл и без регистрации, поэтому это путь для каталогов. См. руководство по пакетной обработке.

Сколько экономит WebP?

На 25–35% меньше, чем JPEG при равном качестве, и часто больше, чем PNG для графики с прозрачностью. Экономия — это причина конвертации для доставки в вебе. Сохраните оригинал как мастер; экспортируйте WebP для доставки и подавайте его со запасным вариантом для старых браузеров.

WebP с потерями или без потерь?

И то, и другое — WebP поддерживает режим с потерями (меньше, для фотографий) и режим без потерь (точные пиксели, для графики и мастер-файлов). Выбирайте в зависимости от контента: с потерями для фотографий, без потерь для графики со sharp edges или текстом, где артефакты будут заметны. Эта двойная поддержка — одна из причин, по которой WebP заменяет как JPEG, так и PNG для доставки в вебе.

Что такое команда cwebp?

cwebp -q 80 input.jpg -o output.webp конвертирует JPEG в WebP с качеством 80. Флаг -q устанавливает качество; добавьте -lossless для вывода без потерь и -resize W 0, чтобы изменить размер до целевой ширины. Выполняйте пакетно с помощью цикла оболочки: for f in *.jpg; do cwebp -q 80 "$f" -o "${f%.jpg}.webp"; done. Это бесплатный путь для пакетов без ограничений.

Источники изображений

• Диаграмма сравнения "до/после" и размера JPEG/WebP — создана автором на основе фотографии в стиле электронной коммерции (Pexels #16675632, photo by Mikael Blomkvist) для демонстрации реальной измеренной экономии при переходе с JPEG на WebP.