Короткий ответ: по размеру файла WebP выигрывает почти всегда. По совместимости и рабочим процессам редактирования почти всегда выигрывает PNG. Правильный вопрос не «какой формат лучше», а «какую задачу вы решаете». Но «зависит» полезно только когда понятно, почему зависит, а это определяется тем, как каждый формат сжимает.
Как сжимают оба формата
PNG умеет ровно одно: сжатие без потерь. Каждая строка пикселей проходит через фильтр предсказания, который делает данные максимально повторяющимися, затем DEFLATE — та же семья LZ77 плюс Хаффман, что внутри ZIP-архивов, — дожимает результат. Каждый пиксель выживает бит в бит. PNG проектировали в середине 1990-х как свободную от патентов замену GIF, и о рождении PNG объясняет, почему его построили таким консервативным.
WebP умеет два дела, потому что это фактически два формата под одним расширением. Lossy WebP — это VP8, интра-фрейм кодек из видеоразработок Google: блочный, частотный, философски cousin JPEG. Lossless WebP — это VP8L, специально построенный кодек без потерь с собственным энтропийным кодированием, цветовыми преобразованиями и пространственным предсказанием. Google выпустила всё это в 2010 году, и о рождении WebP — полная предыстория.
Оба формата поддерживают альфа-прозрачность, но по-разному. PNG несёт альфу как полноценный канал рядом с красным, зелёным и синим. Lossy WebP прикрепляет альфу отдельным каналом, кодированным без потерь, рядом с цветовыми данными с потерями — так получается сжатое фото с чётким прозрачным вырезом, чего не умели ни JPG, ни чистый VP8 поодиночке. Если разница между двумя философиями сжатия размыта, наша статья о сжатии с потерями и без закрывает основы.
Реальность размеров
Собственные бенчмарки Google заявляют, что lossless WebP примерно на 26 % меньше PNG на тех же изображениях. На практике, на реальной графике, эта цифра держится:
| Изображение | PNG | WebP (без потерь) | WebP (с потерями, q80) |
|---|---|---|---|
| Скриншот интерфейса 1920×1080 | ~250 КБ | ~180 КБ | ~90 КБ |
| Логотип с прозрачным фоном | ~40 КБ | ~28 КБ | ~12 КБ |
| Фото 12 Мп (для сравнения) | ~20 МБ | ~14 МБ | ~1,5 МБ |
Бросаются в глаза две вещи. Во-первых, lossless WebP бьёт PNG на его собственном поле — скриншоты, логотипы, плоская графика — со стабильным отрывом, потому что предикторы и энтропийный кодировщик VP8L на поколение впереди DEFLATE. Во-вторых, настоящий разгром устраивает колонка с потерями: фото в lossy WebP на порядок меньше, чем в PNG. Эквивалентное сравнение с JPG мы делали в статье JPG против PNG, а гид по веб-форматам изображений показывает, где стоят все три.
Где PNG по-прежнему выигрывает: всё, что не браузер
Каждый современный браузер рендерит WebP уже много лет. В этом предложении много веса, потому что стоит выйти за пределы браузера, и поддержка WebP становится дырявой. Старым версиям Photoshop нужен плагин. Некоторые формы загрузки CMS и инструменты маркетплейсов отвергают .webp наотрез. Десктопные просмотрщики на старых ОС пожимают плечами. Офисные пакеты, типографии и встраиваемые системы отстают ещё сильнее.
У PNG нет ни одной из этих проблем. Он читается везде с конца 1990-х: любой редактор, любая ОС, любой офисный пакет, любой печатный конвейер. Когда говорят, что файл «просто работает», обычно имеют в виду PNG или JPG.
Вопрос рабочего процесса
Это часть, которую большинство сравнений пропускает. PNG — не просто формат раздачи, это стандартный промежуточный формат. Он открывается везде, не деградирует при пересохранении, и любой инструмент в любом пайплайне его принимает. Поэтому дизайнеры экспортируют рабочие файлы в PNG, даже когда финальный ассет уходит в WebP.
Здравый процесс выглядит так: редактировать и архивировать в PNG (или в настоящем рабочем формате вроде PSD), затем экспортировать WebP для сайта. WebP — транспортный контейнер, PNG — мастерская. Версия этого выбора специально для сайтов — в статье PNG против WebP для веб-сайтов, а WebP против JPG закрывает фотосторону вопроса.
Что выбирать и когда
| Задача | Формат | Почему |
|---|---|---|
| Изображения на сайте под вашим контролем | WebP | меньше при том же качестве, альфа в комплекте |
| Скриншоты и интерфейсная графика | WebP для публикации, PNG для обмена | размер против универсального открытия |
| Отправка файлов клиентам или в типографию | PNG | открывается везде, без вопросов |
| Редактирование и архивирование | PNG | без потерь, читается любым инструментом |
| Загрузка в чужую форму | PNG | многие формы до сих пор отвергают WebP |
Когда нужно конвертировать
Если WebP-файл отскочил от формы загрузки или старого приложения, WebP в PNG конвертирует его локально в вашем браузере — прозрачность на месте, ничего никуда не уходит; пошаговая инструкция — в статье как конвертировать WebP в PNG. В обратную сторону PNG в WebP обычно срезает четверть размера графики или больше перед публикацией на странице. Оба работают полностью на вашем устройстве.
Правило, которое следует из всего вышесказанного: мастера храните в PNG, в веб отдавайте WebP, а когда внешний мир не согласен — конвертируйте по требованию.
