PNG чи JPG? Правило на десять років, яким я вирішую

PNG і JPG понад двадцять років лишаються двома типовими відповідями на «збережи це зображення», і більшість людей обирає між ними випадково — як стояло за замовчуванням у діалозі експорту. Це працює до дня, коли ви надсилаєте комусь скриншот на 9 МБ або викладаєте логотип з бридким сірим ореолом навколо, — і раптом вибір починає важити.

Ось у чому річ: рішення насправді просте. Воно зводиться до одного питання, яке я ставлю вже років десять, і воно ще жодного разу мене не підвело.

Те єдине питання

Це зображення зроблене з країв чи зі світла?

Оце й усе. Текст, логотипи, іконки, скриншоти, схеми, штрихові малюнки, будь-що з різкими межами й плоскими ділянками кольору — це краї. Фотографії, градієнти, будь-що з плавним неперервним тоном і тисячами ледь помітних переходів кольору — це світло.

Краї хочуть PNG. Світло хоче JPG. Майже все випливає звідси.

Чому краї хочуть PNG

PNG працює без втрат. Кожен піксель, який ви зберегли, повертається рівно таким самим, назавжди, скільки б разів ви його не відкривали. Він стискає, знаходячи ділянки однакового кольору, — а саме цього повно в зображеннях із країв: суцільна кнопка, білий фон, чорна лінія. PNG ковтає таке на льоту й лишається гострим як лезо.

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

Слабке місце — фотографії. Збережіть фото в PNG, і він сумлінно запише кожну крихту шуму матриці й кожен мікроградієнт із повною точністю, а файл роздується. PNG марнотратний не тому, що поганий. Він марнотратний тому, що чесний щодо деталей, які око радо пробачило б.

Чому світло хоче JPG

JPG працює з втратами. Він викидає інформацію, яку око погано помічає, — тонкі варіації кольору, високочастотні деталі, — і робить це на фотографіях чудово. Це рівно те, чого у фото вдосталь. Наслідок — файл у рази менший, а того, що зникло, ви не бачите.

А ось наведіть JPG на краї — і він розсипається. Він розмазує нечіткі артефакти навколо різких меж — особливо навколо тексту, — бо гострі краї і є та сама високочастотна деталь, яку він створений відкидати. JPG-скриншот коду має трохи брудний вигляд навколо кожної літери. Це не ваш монітор. Це формат працює як задумано на неправильному вході.

Таблиця розмірів, яка все вирішує

Ті самі два джерела, збережені обома способами за розумних налаштувань:

Читайте в обидва боки. Фото майже вп'ятеро менше в JPG без видимих втрат. Але скриншот і логотип більші в JPG — і мали б гірший вигляд теж, з ореолами й брудом. Те, який формат менший, повністю перевертається залежно від того, що на картинці. Ось увесь урок у трьох рядках.

Крайні випадки (варто знати лише два)

Прозорість змушує брати PNG. Якщо бодай частина зображення має бути наскрізною, JPG відпадає незалежно від вмісту, бо фізично не вміє зберігати альфа-канал. Навіть фото, вирізане на прозорому фоні, має бути PNG (або WebP).

Текст поверх фото — питання судження. Фото із вписаним підписом — частково світло, частково край. Я беру JPG, якщо це переважно фото, і мирюся з трохи м'яким текстом, або PNG, якщо текст мусить лишитися чітким і я можу дозволити собі розмір. Чистого переможця тут немає; ви обираєте, який недолік вам стерпніший.

Коли у вас уже не той

Здебільшого ви не обираєте на експорті — ви застрягли з файлом, який хтось уже зберіг неправильно. Фотограф передав вам PNG на 14 МБ. Дизайнер надіслав логотип як JPG з ореолом. Це просто конвертація.

Іти в розумний бік — PNG у JPG для фото, збереженого надто важким, — це чистий виграш, і працює це прямо у вашому браузері, тож файл не покидає пристрій. Іти в інший бік — JPG у PNG — чесно, але обмежено: файл стає без втрат відтепер і надалі, що вам і потрібно перед редагуванням, але розмазані артефакти, які JPG уже вписав, це не прибере. Втрати — двері в один бік. Конвертація в PNG не проведе вас назад крізь них; вона лише зупиняє подальшу втрату.

Поставте те єдине питання — краї чи світло — і будете праві фактично щоразу. Я досі ставлю його на кожному експорті. Це забирає пів секунди й уберегло мене від безлічі сірих ореолів.