Сжатие PNG — это процесс уменьшения размера файла изображения в формате PNG без его конвертации в другой формат, при котором ставится задача максимально сохранить визуальное качество: чёткость краёв, читаемость текста, цветовую точность и отсутствие характерных блочных или размытых артефактов.
- Почему PNG сжать сложнее, чем JPEG
- Методы сжатия PNG и их влияние на качество
- Инструменты для сжатия PNG без артефактов
- Настройки pngquant для предотвращения «мыла»
- Роль дизеринга при снижении битности
- Альтернатива PNG: когда лучше перейти на WebP или AVIF
- Практический чеклист сжатия PNG без потери качества
- Типичные ошибки и как их избежать
Почему PNG сжать сложнее, чем JPEG
PNG использует алгоритм сжатия без потерь (lossless), основанный на Deflate. Это означает, что стандартное сжатие не ухудшает качество, но и не даёт такого выигрыша в весе, как lossy-форматы. Чтобы реально уменьшить файл, применяют дополнительные техники, которые работают на уровне палитры, прозрачности и предварительной фильтрации пикселей.
Ключевые причины, по которым наивное сжатие даёт «мыло»:
- Принудительная конвертация в JPEG внутри инструментов «оптимизации»
- Даунсэмплинг (уменьшение разрешения) без предупреждения
- Применение lossy-алгоритмов к PNG-палитре с большими допусками
- Агрессивное снижение битности без дизеринга
Методы сжатия PNG и их влияние на качество
Существует два принципиальных подхода: lossless-оптимизация и lossy-оптимизация PNG. Они дают разный результат по весу и качеству.
| Метод | Потеря качества | Снижение веса | Подходит для |
|---|---|---|---|
| Lossless (oxipng, zopfli) | 0% | 5–20% | Любые PNG |
| Lossy quantization (pngquant) | минимальная при quality ≥ 80 | 40–70% | Фото-иллюстрации, скриншоты |
| Снижение битности до 8-bit | заметная при gradients | 30–50% | Иконки, логотипы с плоскими цветами |
| Удаление метаданных (exif, icc) | 0% | 1–15 КБ на файл | Все PNG |
Инструменты для сжатия PNG без артефактов
На 2026 год наиболее актуальны следующие инструменты с поддержкой актуальных стандартов и алгоритмов:
- pngquant 2.x — lossy-квантование с настройкой quality (0–100), поддерживает —quality 80-95 для баланса веса и чёткости
- oxipng 9.x — lossless-оптимизация, многопоточная, поддерживает zopfli-компрессию; типичный выигрыш — 10–18%
- Squoosh (Google) — браузерный инструмент с WebAssembly-бэкендом, использует OxiPNG и pngquant; обновлён в 2025 году
- ImageMagick 7.x — командная строка, параметр -define png:compression-level=9 без потерь
- Sharp (Node.js) — серверная оптимизация, поддерживает compressionLevel и effort для PNG
- TinyPNG API — облачный сервис, lossy-алгоритм, лимит 500 изображений/месяц бесплатно в 2026 году
Настройки pngquant для предотвращения «мыла»
Самая частая причина размытости при сжатии PNG — неправильно выставленный параметр quality в pngquant. Рекомендуемые значения:
| Сценарий | Команда / параметр | Ожидаемый вес |
|---|---|---|
| Веб-иконки, UI-элементы | —quality=90-100 —speed 1 | −40% без видимых потерь |
| Скриншоты с текстом | —quality=85-95 —nofs | −45–55%, текст читаем |
| Иллюстрации с градиентами | —quality=80-90 —dithering=0.8 | −50–65%, без полос |
| Максимальное сжатие (допустимы артефакты) | —quality=60-80 —speed 3 | −65–75% |
Роль дизеринга при снижении битности
При переходе с 32-bit или 24-bit PNG на 8-bit палитру (256 цветов) градиентные переходы теряют плавность. Дизеринг — метод добавления шума для имитации промежуточных цветов. Без него на фото появляются полосы, а на скриншотах — «грязь» вокруг теней.
- Floyd-Steinberg — стандартный алгоритм дизеринга, встроен в pngquant и ImageMagick; даёт естественный зернистый переход
- Ordered dithering — создаёт регулярный паттерн, подходит для пиксель-арта и иконок
- Без дизеринга (—nofs) — лучший выбор для изображений с чёткими линиями и плоскими цветами (логотипы, UI)
Альтернатива PNG: когда лучше перейти на WebP или AVIF
Если изображение содержит фотографический контент с плавными градиентами — PNG изначально не оптимальный формат. Сравнение форматов на 2026 год:
| Формат | Поддержка браузеров (2026) | Сжатие vs PNG | Прозрачность |
|---|---|---|---|
| PNG (оптимизированный) | 100% | базовый | Да (alpha) |
| WebP lossless | 97% | −26% vs PNG | Да |
| WebP lossy | 97% | −60–75% vs PNG | Да |
| AVIF | 93% | −50–80% vs PNG | Да |
Практический чеклист сжатия PNG без потери качества
- Удалить метаданные (exif, icc-profile, текстовые чанки) — нулевая потеря качества, экономия до 15 КБ
- Запустить oxipng с флагом —opt max для lossless-оптимизации перед lossy-этапом
- Применить pngquant с —quality не ниже 80 при наличии текста или мелких деталей
- Проверить результат при 100% масштабе, а не в уменьшенном превью
- Сравнивать исходник и результат в режиме pixel peeping — увеличение 400% выявляет артефакты, незаметные при обычном просмотре
- Для градиентных PNG включить дизеринг Floyd-Steinberg с уровнем 0.7–0.9
- Для иконок и UI с плоскими цветами дизеринг отключить (—nofs)
- Автоматизировать pipeline через imagemin, sharp или GitHub Actions для batch-обработки
Типичные ошибки и как их избежать
| Ошибка | Последствие | Решение |
|---|---|---|
| Сохранение через «Сохранить для Web» в Photoshop без настроек | Автоконвертация в JPEG или агрессивный lossy | Использовать «Export As» → PNG + ручной прогон oxipng |
| Онлайн-сервисы без указания quality | Непредсказуемый результат, часто quality=60 | TinyPNG API с явным указанием параметров или локальный pngquant |
| Повторное сжатие уже сжатого PNG | Накопление артефактов квантования | Всегда работать с оригиналом, хранить мастер-файл |
| Игнорирование ICC-профиля | Цветовой сдвиг на откалиброванных мониторах | Встраивать sRGB-профиль или удалять только нестандартные профили |