Чтобы уменьшить PNG, либо перекодируйте его оптимизатором без потерь, который плотнее упаковывает те же пиксели, либо сократите палитру до 256 цветов или меньше, что уменьшает файл гораздо сильнее. Уменьшение числа цветов формально сжатие с потерями, но на скриншотах, логотипах и значках разница обычно незаметна. Фото, сохраненные в PNG, сильнее всего уменьшаются при переводе в JPG.
Уменьшение размеров в пикселях помогает с любыми PNG. В этой инструкции разобраны оба способа сжатия, встроенные возможности Mac и Windows и случаи, когда настоящее решение это другой формат.
Почему файлы PNG такие большие?
PNG это формат без потерь. Каждый пиксель хранится точно, поэтому файл должен описывать их все. Это хорошо работает, когда большие области одного цвета, как на скриншоте страницы настроек или в плоском логотипе. Компрессор находит повторы и плотно их упаковывает.
На фото это работает плохо. В фото почти каждый пиксель немного отличается, поэтому повторов мало. Снимок с камеры в PNG обычно в несколько раз больше того же снимка в JPEG, без видимой пользы. Если хотите узнать о самом формате, читайте статью о том, что такое файл PNG.
Что еще раздувает PNG:
- Полноцветный режим с альфа-каналом, когда в изображении всего несколько цветов.
- Большие размеры, например скриншот всего экрана монитора с высоким разрешением.
- Лишние блоки данных: цветовые профили, текстовые комментарии или данные редактирования из дизайнерских программ.
- Слабые настройки сжатия в программе, сохранившей файл.
Как уменьшить размер PNG: без потерь или с уменьшением числа цветов?
Эти два способа дают очень разный результат, поэтому полезно знать, какой из них применяет инструмент, прежде чем сжимать важные для вас PNG.
Оптимизация PNG без потерь
Пиксели остаются идентичными. Инструмент подбирает лучшие фильтры и более сильное сжатие DEFLATE и убирает ненужные метаданные. Экономия скромная и зависит от того, насколько хорошо файл сжало исходное приложение. Используйте этот режим везде, где важны точные пиксели: для технических схем, макетов интерфейса для разработчика и изображений, которые вы будете еще редактировать.
Уменьшение числа цветов (палитра, или PNG «с потерями»)
Инструмент подбирает лучший набор из максимум 256 цветов и приводит каждый пиксель к одному из них, используя дизеринг, чтобы скрыть переходы. Результат остается обычным PNG, который открывает любое приложение, с прозрачностью, и часто весит в несколько раз меньше оригинала. На скриншоте или логотипе разницу вы вряд ли заметите. На градиенте, мягкой тени или фото может появиться полосатость.
Разумное правило: на скриншотах, значках и иллюстрациях сначала пробуйте уменьшение числа цветов. Если на плавных участках видна ступенчатость, вернитесь к варианту без потерь.
Как сжать PNG онлайн без загрузки на сервер
Инструмент «Сжать PNG» выполняет оба вида сжатия в вашем браузере, поэтому изображение не покидает устройство.
- Откройте инструмент и перетащите в него один или несколько файлов PNG.
- Выберите вариант без потерь, если нужны идентичные пиксели, или с уменьшением числа цветов для самого маленького файла.
- Если у формы жесткий лимит, введите желаемый размер в КБ. Инструмент сначала подбирает качество и уменьшает размеры, только если иначе нельзя.
- Скачайте результат и сравните с оригиналом в масштабе 100%, особенно вокруг градиентов и теней.
Прозрачность сохраняется в обоих случаях, так что логотипы по-прежнему аккуратно лежат на цветном фоне. Если задаете желаемый размер в КБ, оставьте небольшой запас ниже лимита. Не все сайты считают килобайт одинаково, как объясняется в статье о том, сколько КБ в МБ.
Как уменьшить размер PNG на Mac или Windows
Ни в одной из этих систем нет встроенного оптимизатора PNG. Но обе умеют уменьшать размеры в пикселях, а это часто дает самую большую экономию.
На Mac в Preview
- Откройте PNG в «Просмотре».
- Выберите «Инструменты > Настроить размер».
- Оставьте флажок "Масштабировать пропорционально" и введите меньшую ширину.
- Проверьте итоговый размер, который Preview показывает внизу окна, затем нажмите OK и сохраните.
Подробности в руководстве Apple об изменении размера изображений в Preview.
В Windows 11 в приложении "Фотографии"
- Откройте изображение в «Фотографиях».
- Нажмите "Подробнее" (три точки) и выберите "Изменить размер изображения".
- Выберите "Пиксели" или "Проценты" и введите меньший размер.
- Сохраните как копию, чтобы оригинал остался нетронутым.
Скриншот на всю ширину дисплея с высоким разрешением часто вдвое шире, чем нужно для документа или справочной статьи. Если уменьшить ширину вдвое, количество пикселей сократится в четыре раза, и файл обычно уменьшится примерно так же.
Как уменьшить размер PNG для формы загрузки
Формы строже сайтов. Они часто задают лимит в КБ, иногда фиксируют размеры в пикселях, а многие принимают только JPG. Действуйте в таком порядке:
- Прочитайте требования формы: максимальный размер, допустимые форматы и нужные ширину и высоту.
- Если форма указывает точные размеры, сначала измените размер под них. Дальше все будет проще.
- Если PNG принимается, сожмите его с уменьшением числа цветов и желаемым размером чуть ниже лимита.
- Если принимается только JPG, лучше сконвертируйте. Прозрачные области в JPG становятся сплошным цветом, обычно белым, поэтому проверьте края подписей и логотипов.
Частый случай: подписи, отсканированные в PNG. Они в основном белые с тонкими темными штрихами, поэтому уменьшение числа цветов отлично их сжимает, сохраняя четкость линий.
Когда лучше преобразовать PNG в JPG или WebP?
Сжатие может дать немного, если формат не подходит под содержимое. Меняйте формат, когда:
- Изображение это фото без прозрачности. Конвертация через PNG в JPG обычно дает самое большое уменьшение.
- Изображение пойдет на сайт. WebP поддерживает прозрачность и обычно меньше PNG для той же картинки, а все современные популярные браузеры его отображают.
- Форма принимает только JPG. Так делают многие порталы загрузки.
Оставляйте PNG, когда нужен четкий текст, прозрачность в формате, который открывает любое приложение, или точные пиксели. При конвертации скриншота в JPG вокруг букв обычно появляются размытые ореолы, а насыщенный деталями скриншот может даже получиться больше, чем PNG.
Когда какой формат уместен, читайте в сравнении PNG и JPG: в чем разница.
Частые ошибки при уменьшении размера PNG
- Сохранять фото в PNG "ради качества". Выигрыш незаметен, а файл огромный.
- Уменьшать число цветов в PNG, который вы будете еще редактировать. Храните мастер-копию без потерь, а уменьшенную версию экспортируйте в конце.
- Терять прозрачность при конвертации в JPG и потом обнаруживать белый прямоугольник вокруг логотипа.
- Дважды запускать уменьшение числа цветов. Каждый проход может добавить ступенчатость, поэтому всегда начинайте с оригинала.
- Игнорировать размеры. Значок шириной 3000 пикселей останется большим, как бы хорошо его ни сжали.
Проверяйте результат там, где он будет показан. PNG, который хорошо смотрится на белой странице, на темном фоне может показать неровные, зубчатые края. Это признак того, что цветов убрали слишком много, так что попробуйте снова с большим числом цветов или переключитесь на режим без потерь.
Бесплатные инструменты, которые работают в браузере
Частые вопросы
Как уменьшить размер файла PNG?
Пропустите его через инструмент сжатия PNG: для скриншотов и графики с уменьшением числа цветов, а когда пиксели должны остаться точными, в режиме без потерь. Уменьшение размеров в пикселях тоже сильно помогает.
Можно ли сжать PNG без потери качества?
Да. Оптимизация без потерь упаковывает те же пиксели эффективнее и убирает лишние метаданные, поэтому изображение остается идентичным. Экономия меньше, чем при уменьшении числа цветов.
Убирает ли сжатие PNG прозрачность?
Нет, если инструмент сохраняет альфа-канал, а это умеют и сжатие без потерь, и сжатие с палитрой. Прозрачность теряется, только когда вы переводите файл в формат вроде JPG.
Почему мой PNG больше, чем версия в JPG?
PNG хранит каждый пиксель точно, что подходит для плоской графики и текста, но не для фото. Для фото JPG или WebP отбрасывают невидимые глазу детали и получаются намного меньше.
Что такое PNG с потерями?
Это обычный PNG, цвета которого сведены к меньшей палитре, обычно до 256 или меньше. Его откроет любое приложение, и он намного легче, но на градиентах может появиться легкая полосатость.
