JPG, PNG чи WebP: який формат вибрати?

Одним реченням: фото — у JPG або WebP, графіка й прозорість — у PNG або WebP. Перш ніж переходити на WebP, переконайтеся, що майданчик, куди ви завантажуєте файли, його приймає.

JPG (також пишуть JPEG) компактно зберігає фотографії, відкидаючи дрібні деталі, які око рідко помічає. Його приймають майже всі сайти, застосунки, поштові сервіси й маркетплейси, тому це найнадійніший вибір, якщо ви не впевнені.

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

Щоб зменшити JPG без зміни формату, скористайтеся сервісом стиснення зображень; щоб спробувати WebP — JPG у WebP.

PNG стискає без втрат: кожен піксель зберігається точно таким, яким був. Тому він підходить для логотипів, іконок, знімків екрана інтерфейсу й усього, де є текст, а ще підтримує повну прозорість, зокрема м’які краї та тіні.

Ціна цього — розмір. Фотографія в PNG зазвичай у кілька разів більша за добрий JPG. За даними Web Almanac 2024 від HTTP Archive, медіанний PNG в інтернеті використовував 3,8 біта на піксель, проти 2,0 у JPG і 1,3 у WebP.

Якщо в PNG фотографія, конвертуйте її. Якщо графіка — стисніть як PNG або спробуйте PNG у WebP: прозорість при цьому зберігається.

Google створила WebP саме для вебу, і він працює обома способами: стискає із втратами, як JPG, або без втрат, як PNG, — і в обох випадках із прозорістю. За даними Google, файли WebP без втрат на 26% менші за PNG, а WebP із втратами на 25–34% менші за порівнянні JPG.

WebP показують усі сучасні популярні браузери — близько 97% тих, якими користуються, зокрема Safari починаючи з версії 14. Заковика — поза браузером. Деякі платформи досі не приймають завантаження WebP: наприклад, Amazon, Etsy і Mailchimp зазначають JPG і PNG, але не WebP.

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

1. 01Чи потрібна зображенню прозорість? Використовуйте PNG або WebP там, де його приймають.
2. 02Це фотографія чи реалістичне зображення? Використовуйте JPG, а на власному сайті можна й WebP.
3. 03Це знімок екрана, діаграма, логотип чи текст? Використовуйте PNG, потім спробуйте WebP і порівняйте файли.
4. 04Куди зображення буде завантажено? Переконайтеся, що платформа приймає формат; якщо ні, залишайтеся на JPG або PNG.
5. 05Стисніть остаточний файл, хоч би який у нього формат.

Розміри й обмеження конкретних платформ — у статті вимоги до розміру зображень для пошти та інтернет-магазинів.

AVIF — новіший формат, який може давати ще менші файли, але створюється повільніше, а приймає його менше інструментів і платформ. У вебі він досі рідкість: за даними Web Almanac 2025, на AVIF припадало 0,7% LCP-зображень, проти 11% у WebP, 26% у PNG і 57% у JPG. Більшості сайтів сьогодні цілком достатньо JPG, PNG і WebP.

• Зберігати фото в PNG заради якості. PNG зберігає наявні деталі, але не може додати нових, а файл збільшується в кілька разів.
• Конвертувати JPG у PNG, щоб виправити розмиті краї. Пошкодження вже є в JPG; натомість поверніться до оригіналу.
• Переводити все на WebP без перевірки. Ваш сайт може охоче його прийняти, а платформа магазину чи сервіс розсилок — відхилити.
• Зупинятися на виборі формату. Формат задає відправну точку; решту робить стиснення остаточного файлу.

Далі: як стиснути зображення для сайту, крок за кроком.