PNG, JPG или WebP

Версия в одну строку

Используйте JPG для фотографий, PNG для всего с чёткими краями, текстом или прозрачностью и WebP, когда назначение — веб-страница и вы сами решаете, чем её открывают. Если вы больше ничего не запомните, это правило будет верным в подавляющем большинстве случаев.

Почему JPG до сих пор повсюду

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

Этот же приём делает JPG плохим для всего остального. Чёткий чёрный текст на белом находится именно на той границе, с которой формат справляется хуже всего, поэтому скриншот, сохранённый как JPG, обзаводится грязноватым ореолом вокруг каждой буквы. Сжатие не сломано — оно делает именно то, для чего создано, но с содержимым, для которого не предназначено.

Зачем нужен PNG

PNG — формат без потерь. Каждый пиксель, который вы в него помещаете, возвращается обратно бит в бит, сколько бы раз вы ни открывали и ни пересохраняли файл. У него также есть настоящий альфа-канал, так что части изображения могут быть по-настоящему прозрачными, а не залитыми цветом фона.

Цена — размер. PNG сжимает, находя закономерности и повторения, что прекрасно работает на однотонных заливках, логотипах, диаграммах и скриншотах и плохо — на фотографиях, где каждый пиксель немного отличается от соседнего. Фото, сохранённое как PNG, легко оказывается в пять раз больше JPG без видимого выигрыша.

Где WebP действительно выигрывает

WebP выполняет обе задачи. У него есть режим с потерями, который в целом превосходит JPG при том же визуальном качестве, и режим без потерь с прозрачностью, который в целом превосходит PNG. Типичная экономия по сравнению с PNG составляет от 30% до 70%.

Проблема не в браузерах — все современные браузеры читают WebP. Проблема во всём остальном: старом настольном ПО, некоторых принтерах, некоторых корпоративных системах документов и длинном хвосте инструментов, которые просто откажутся открывать файл. Если вы публикуете в интернете, используйте WebP. Если отправляете файл человеку, который откроет его неизвестно в чём, — нет.

Ловушка, в которую попадают почти все

Конвертация JPG в PNG не восстанавливает качество. Она делает файл безущербным начиная с этого момента, что останавливает дальнейшее ухудшение, но детали, которые исходный JPG отбросил, потеряны навсегда, а PNG добросовестно сохраняет вместе с ними и все артефакты сжатия. В итоге вы получаете гораздо более крупный файл с теми же самыми недостатками.

Полезно следствие: если вы собираетесь редактировать изображение многократно, работайте в PNG и экспортируйте в JPG один раз в самом конце. Каждое промежуточное сохранение в формате с потерями накапливает ущерб.

Что происходит с прозрачностью

Прозрачность поддерживают только PNG, WebP, GIF и ICO. При конвертации любого из них в JPG или BMP эти области должны чем-то стать, потому что в формате нет места для записи «здесь ничего нет». Инструменты выбирают по-разному; на удивление многие выбирают чёрный, что портит логотипы. На этом сайте заливка белым выбрана намеренно, и это почти всегда то, что ожидают люди.

Чтобы применить это на практике: конвертируйте PNG в WebP для более лёгких веб-изображений, конвертируйте JPG в PNG, когда нужна копия без потерь, или сожмите изображение, не меняя его формат.