Подготовьте параметры, специфичные для PNG, для логотипов, скриншотов, элементов интерфейса и прозрачной графики.
Статические PNG-файлы; APNG в этой версии не поддерживается · Лимит файлов: 20 · 5 MB на файл
Сжатие с учётом прозрачности
Выберите стратегию PNG, которая учитывает прозрачные края, чёткий текст и графику с плоскими цветами.
Сохраняйте прозрачные и полупрозрачные пиксели.
Оптимизируйте кодирование, не изменяя намеренно значения пикселей.
Используйте меньше цветов, когда логотипы или элементы UI это допускают.
Анимированные PNG-файлы не входят в этот процесс.
Самый маленький PNG не имеет смысла, если теряются прозрачность или чёткие края.
Анатомия PNG
PNG может сочетать непрозрачные пиксели, частичную прозрачность, текст и области с плоскими цветами. Эти свойства стоит проверять отдельно, а не применять фотографический пресет сжатия.
Проверьте сглаженные края на светлом и темном фоне, чтобы «сплющивание» или ореолы не прятались в одном предпросмотре.
Изменения палитры могут повлиять на плавные тона и детали толщиной в 1 пиксель, даже если на уменьшенной миниатюре все выглядит нормально.
Просмотрите экспортированный PNG на светлом и темном фоне. Проверьте мелкий текст, плоские цвета, градиенты и частично прозрачные края.
Стратегия PNG
PNG-графике часто нужны прозрачность, четкие края и стабильные цвета. Прежде чем думать о сокращении палитры, решите, должны ли декодированные пиксели оставаться точными.
Используйте, когда фирменные цвета по договору, пиксели интерфейса или значения на прозрачных краях должны сохраниться без изменений после декодирования.
Плоская графика может выдержать меньше цветов, а градиенты, скриншоты и текстурированные иллюстрации могут дать заметные полосы (banding).
Используйте workflow JPG для непрозрачной фотографии только когда прозрачность не нужна. Оставайтесь на PNG, когда изображению требуются прозрачные пиксели.
Проверьте результат
Разместите PNG на светлом и темном фоне, чтобы выявить кайму вокруг волос, теней или сглаженного текста.
Проверьте логотипы и графику интерфейса: не изменились ли фирменные цвета и не пропали ли оттенки. Сокращение палитры может влиять на эти области иначе, чем на фотографии.
Если требуются точные пиксели, сравнивайте значения декодированных пикселей, а не байты файла. Сам по себе меньший PNG не является доказательством результата без потерь.
Процесс работы с PNG построен вокруг сохранения альфа-прозрачности. Прежде чем заменять исходный файл, проверьте реальный результат обработки в VisionStory.
