Инструкция

Сжать изображение без видимой потери качества

Большинство изображений покидают камеру или дизайн-редактор более тяжёлыми, чем нужно браузеру или письму. Сжатие не означает порчу картинки: при правильном уровне качества и формате результат выглядит идентично оригиналу и грузится в два-пять раз быстрее. Главное правило: сначала выбрать формат, и только потом настраивать качество.

Шаг за шагом

Выберите формат вывода прежде, чем трогать ползунок качества. JPEG или WebP для фотографий, PNG только если нужен прозрачный фон или точность без потерь до пикселя. WebP опережает JPEG на 25-35 процентов при том же визуальном качестве, и его поддерживает любой современный браузер: предпочитайте его всегда, когда контролируете, где будет показано изображение.
Перетащите изображение в компрессор и отрегулируйте ползунок качества. Начните с 80 процентов для фотографий и сравните превью до и после рядом друг с другом. Снизьте до 70, если файл всё ещё слишком большой: разница редко заметна при обычном размере экрана. Для графики с чётким текстом или плоскими цветами переключитесь на PNG без потерь или попробуйте SVG, если исходник векторный.
Скачайте результат и проверьте его при 100-процентном масштабе перед публикацией. Если загрузка на сайт повторно пересжимает картинку (соцсети обычно так и делают), отправьте версию чуть более высокого качества, чтобы двойное сжатие осталось приемлемым. Компрессор работает целиком в вашем браузере: файл никогда не покидает устройство.

Почему выбор формата важнее цифры качества

JPEG при качестве 80 и WebP при качестве 80 выглядят похоже на экране, но файл WebP заметно меньше. AVIF идёт ещё дальше, хотя кодирование занимает больше времени. PNG, который часто ошибочно используют для фотографий, даёт файлы в несколько раз тяжелее JPEG для той же фотографии, потому что он по своей природе без потерь. Изменение размера перед сжатием тоже помогает: фото шириной 4000 пикселей, уменьшенное до 1200 пикселей под колонку блога, теряет в весе гораздо больше за счёт изменения размера, чем за счёт любой настройки качества.

Почему сжимать локально, а не загружать

Серверные сервисы обработки изображений заставляют вас загрузить оригинал, часто необработанное фото с телефона, и скачать сжатую копию. Компрессор здесь работает в вашем браузере по тем же алгоритмам: ничего не загружается, нет аккаунта, нет очереди, а исходный файл остаётся на устройстве. Можно обрабатывать несколько изображений сразу, и результаты готовы к использованию или публикации мгновенно.

Инструменты из этого гайда

Частые вопросы

Как понять, что я переборщил со сжатием?

Увеличьте результат до 100 процентов и посмотрите на текстурные зоны: волосы, ткань, листву. Сжатие с потерями раньше всего проявляется именно там в виде блочных пятен или смазанных деталей. Если вы видите это при 100-процентном масштабе, то увидят и посетители с телефона, поэтому поднимите настройку качества на 5-10 пунктов и попробуйте снова.

Менять размер до или после сжатия?

Сначала меняйте размер. Изображение шириной 4000 пикселей, уменьшенное до 1200 пикселей, теряет три четверти своих пикселей независимо от качества, и это всегда даёт большую экономию. С помощью инструмента изменения размера задайте нужные пиксельные габариты, а затем сжимайте под формат и качество. Сжимать огромное изображение, а потом менять его размер, значит зря тратить усилия с обеих сторон.