Коротко
- JPG — фотографии: сжатие с потерями, маленький вес, никакой прозрачности.
- PNG — скриншоты, схемы, логотипы: без потерь и с прозрачным фоном, но тяжелее.
- WebP — тот же вид при меньшем весе, идеален для сайта и хуже подходит для обмена файлами.
JPG: формат фотографий
JPEG сжимает с потерями: часть информации отбрасывается так, чтобы глаз этого не заметил. На фотографиях с плавными переходами приём работает отлично — файл получается в разы легче исходного при почти неотличимой картинке.
Слабое место — резкие границы. Мелкий текст на скриншоте, тонкие линии чертежа и края логотипа обрастают характерной «грязью» вокруг контуров. Ещё одно ограничение: прозрачности в JPEG нет вообще, прозрачный фон при конвертации становится белым.
PNG: формат интерфейсов и графики
PNG сжимает без потерь: что положили, то и получите обратно, пиксель в пиксель. Плюс альфа-канал, то есть настоящая прозрачность. Поэтому PNG — стандарт для скриншотов, иконок, схем и всего, где важна чёткость границ.
Плата за это — вес. Фотография в PNG обычно в несколько раз тяжелее той же фотографии в JPG, и никакого выигрыша в качестве при просмотре не даёт. Перевод фотографии из JPG в PNG не восстановит потерянные детали: он лишь зафиксирует картинку в текущем виде без новых потерь.
PNG не «улучшает» JPG. Он только гарантирует, что дальнейшие пересохранения не добавят новых потерь.
WebP: компромисс для веба
WebP умеет и сжатие с потерями, и без потерь, поддерживает прозрачность и при сопоставимом качестве весит примерно на четверть-треть меньше JPEG. Для сайта это прямая экономия трафика и ускорение загрузки страниц.
Все актуальные браузеры формат понимают. Проблемы возникают в другом месте: часть офисных программ, старых редакторов и форм загрузки WebP не принимает. Отсюда типичный сценарий — картинку скачали с сайта в WebP, а вставить её никуда не получается.
- Для сайта — конвертируйте JPG и PNG в WebP, выигрыш ощутимый.
- Для отправки человеку или загрузки в форму — возвращайте WebP в JPG или PNG.
- Прозрачность живёт в паре WebP ↔ PNG; через JPG она теряется безвозвратно.
AVIF: следующий шаг за WebP
AVIF основан на видеокодеке AV1 и сжимает ещё сильнее: обычно на 30–50% легче JPEG сопоставимого качества и заметно легче WebP. Прозрачность он поддерживает, современные браузеры — тоже.
Ограничение то же, что у WebP, только выраженнее: за пределами браузера формат пока принимают редко. Поэтому AVIF хорош как формат отдачи картинок на сайте и плох как формат обмена файлами — для писем, документов и форм загрузки его переводят обратно в JPG.
- Сайт с тяжёлыми иллюстрациями — AVIF даёт самый большой выигрыш по весу.
- Скачали картинку с сайта в .avif и не открывается — переводите в JPG или PNG.
- Кодирование AVIF медленнее, чем JPEG и WebP: это плата за степень сжатия.
Как выбрать за пять секунд
Практическое правило простое и почти не даёт осечек: смотрите не на формат исходника, а на содержимое картинки и на то, куда она поедет.
- Фотография для отправки, печати или загрузки в форму — JPG.
- Скриншот, схема, чертёж, логотип, картинка с прозрачным фоном — PNG.
- Любая картинка, которая ляжет на страницу сайта, — WebP или AVIF.
- Файл не принимает форма — конвертируйте в JPG, его принимают везде.
Что происходит при конвертации
Перевод между форматами — не магия, и часть свойств теряется необратимо. Полезно держать в голове три случая, которые чаще всего удивляют.
- PNG → JPG: прозрачный фон заливается белым, файл становится в разы легче.
- JPG → PNG: вес растёт, уже потерянные детали не возвращаются.
- WebP → JPG: прозрачность теряется; WebP → PNG сохраняет её полностью.
Когда дело не в формате, а в весе
Иногда менять формат не нужно вовсе: картинка и так в JPG, просто весит 8 МБ, потому что снята на современный телефон. В этом случае формат оставляют, а вес уменьшают сжатием — это сохраняет расширение файла и не ломает ожидания принимающей стороны.
Вопросы и ответы
Что легче — JPG или PNG?
На фотографиях JPG легче в разы. На скриншотах с крупными однотонными областями PNG может оказаться и легче, и заметно чётче.
Улучшится ли качество, если перевести JPG в PNG?
Нет. Детали, отброшенные при первом сжатии JPEG, не восстанавливаются. PNG лишь предотвратит новые потери при последующих сохранениях.
Почему после конвертации PNG в JPG фон стал белым?
JPEG не поддерживает прозрачность, поэтому прозрачные пиксели заменяются сплошным цветом. Если фон должен остаться прозрачным, используйте PNG или WebP.
Стоит ли переводить все картинки сайта в WebP?
Для фотографий и иллюстраций — да, выигрыш по весу заметный. Логотипы в SVG трогать не нужно: векторная графика легче и масштабируется без потерь.
Читать дальше
WebP не открывается: что это за формат и как его конвертировать
Откуда берутся файлы .webp, почему их не принимают редакторы и формы загрузки, и как перевести картинку в JPG или PNG без потери прозрачности.
Чем открыть HEIC на Windows, Android и в браузере
Почему фотографии с iPhone сохраняются в HEIC, где этот формат не открывается и три способа получить обычный JPG — включая настройку камеры, чтобы проблема не повторялась.
Файлы для госпорталов и форм загрузки: формат, размер, разрешение
Почему форма отклоняет документ, какие ограничения встречаются чаще всего и как за несколько шагов привести скан к виду, который принимают без вопросов.