Направление конвертации
Конвертация PNG в WebP
Преобразование PNG → WebP на сервере, без установки программ
- Загрузить
- Выбрать формат
- Скачать
Загрузка файлов
Область приёма файла
или
Файлы PNG. До 5 МБ, до 20 файлов за раз. Изображение можно вставить из буфера обмена: Ctrl+V.
Прозрачность переносится полностью и хранится без потерь, цвет сжимается с потерями. Логотипы и иконки заметно уменьшаются в весе, у скриншотов выигрыш скромнее.
Исходники и результаты хранятся 60 минут, затем стираются фоновым уборщиком. Предельный размер файла — 5 МБ, срок хранения — час.
PNG и WebP: характеристики
| Характеристика | .pngPNG | .webpWebP |
|---|---|---|
| Полное название | Portable Network Graphics | Web Picture Format |
| Разработчик | PNG Development Group, спецификация — W3C | |
| Год появления | 1996 | 2010 |
| Расширение | .png | .webp |
| MIME-тип | image/png | image/webp |
| Содержимое | Двоичное | Двоичное |
| Сжатие | без потерь (Deflate и фильтры строк) | С потерями |
| Прозрачность | альфа-канал, 256 уровней | альфа-канал в обоих режимах |
| Несколько страниц в файле | Нет | Поддерживается |
| Глубина цвета | до 16 бит на канал | нет данных |
| Анимация | через расширение APNG | поддерживается |
| Сильная сторона | скриншоты, логотипы, графика с текстом | нет данных |
| Чем открыть | Просмотр фотографий Windows, Фото (macOS), Adobe Photoshop, GIMP, Paint.NET, любой браузер | Google Chrome, Microsoft Edge, Mozilla Firefox, GIMP, Adobe Photoshop 23 и новее, IrfanView, XnView MP |
| Спецификация | Описание формата | Описание формата |
| Кодек | нет данных | VP8 (с потерями) и VP8L (без потерь) |
| Экономия | нет данных | 25–35 % против JPEG при равном качестве |
| Предел размера | нет данных | 16 383 × 16 383 пикселя |
Преобразование PNG → WebP
Целевой формат хранит цвет с потерями, а альфа-канал упаковывает обратимо: прозрачность переносится точно, а объём падает в два-пять раз. Это принципиально отличается от исходника, где обратимо хранится всё, включая цвет. Отсюда и область применения: логотипы, иконки, иллюстрации и скриншоты для веба, где важен вес страницы, а точность каждого пикселя не критична.
Материал определяет допустимое значение шкалы. Иллюстрации, фотографические вставки и плотные градиенты спокойно переносят 80–85. Скриншоты интерфейсов, таблицы и схемы с подписями кеглем меньше десяти пунктов чувствительны к квантованию: на 70–80 вокруг букв появляется рябь, поэтому для них держат 90–95. Выигрыш при этом скромнее, но остаётся заметным — на плоских заливках формат эффективен даже при высоких значениях шкалы.
Прозрачность переносится с полной точностью: альфа кодируется отдельно и без потерь, поэтому мягкая тень логотипа и сглаженный край иконки не превращаются в рваную кромку и не получают ореола. Это ключевое отличие от JPEG, где альфа-канала нет вовсе и прозрачность приходится сводить на подложку с необратимым смешиванием.
Формат создан для доставки, а не для хранения. Исходники держите у себя: при переработке макета или отправке в печать понадобится обратимый файл. Ограничение по геометрии — 16 383 пикселя на сторону — здесь тоже действует. Метаданные по умолчанию вырезаются, направление принимает несколько файлов за задание, набор результатов отдаётся архивом.
Порядок преобразования PNG → WebP
Шаг 1
Оценка материала
Разделите файлы на две группы: иллюстрации и фотографические вставки — одна, скриншоты и схемы с мелким текстом — другая. Допустимое значение шкалы у них разное, и обрабатывать их разумнее отдельными заданиями.
Шаг 2
Шкала качества
Иллюстрациям достаточно 80–85, интерфейсным снимкам и схемам ставьте 90–95: при более низких значениях вокруг букв появляется рябь от квантования высокочастотных коэффициентов.
Шаг 3
Геометрия под вёрстку
Задайте ширину, в которой картинка реально выводится на странице. Лишние пиксели увеличивают объём как квадрат линейного размера и не улучшают вид на обычном экране.
Шаг 4
Проверка прозрачности
Посмотрите результат на светлой и тёмной подложке. Альфа должна остаться плавной по краям — она кодируется без потерь и от значения шкалы качества не зависит.
Вопросы по работе сервиса
Как ведёт себя альфа-канал при сжатии цвета?
Он кодируется отдельно и без потерь, поэтому шкала качества на него не действует вовсе — она управляет только цветовыми каналами. Логотип с полупрозрачной тенью ляжет на любую подложку без белого прямоугольника и без рваной кромки, каким бы ни было значение шкалы.
Какое значение шкалы выдерживает мелкий шрифт?
При значениях ниже 80 вокруг букв появляется рябь: квантование срезает высокочастотные коэффициенты, которыми и описан контур символа. Ставьте 90–95 — файл всё равно окажется легче исходного, а надписи останутся читаемыми.
Можно ли получить результат без потерь вообще?
Целевой формат такой режим поддерживает, но это направление использует сжатие с потерями для цвета: именно оно даёт основной выигрыш в объёме. Если нужна побитовая точность, обратимым остаётся исходный файл — держите его как оригинал и публикуйте сжатую копию.
От чего зависит выигрыш в объёме?
Логотипы и иллюстрации — в два-пять раз, интерфейсные снимки — обычно в полтора-два. Выигрыш тем больше, чем больше в изображении плавных переходов и фотографических участков: на них обратимое сжатие исходного формата проигрывает сильнее всего.