Ми пропонуємо

NEW CASE
Antana

Створюємо цифрові рішення, які працюють на бізнес

Стати клієнтомСтати клієнтом
Зателефонуйте нам +38 (066) 35-14-529

Зробімо перший крок до вашого сайту — напишіть нам

Закрити
Інструменти

Конвертер зображень у WebP

Текст і зображення

Може зацікавити

Стиснути фото у WebP просто в браузері.

Перетягніть зображення сюди або натисніть, щоб обрати · можна кілька файлів одразу · JPG, PNG, WEBP
Формат
Найменша вага, зберігає прозорість
Якість82 менший файлкраща якість
Ширина
Висота підбирається автоматично

Обробка відбувається у вашому браузері — файли не завантажуються на наш сервер і нікуди не надсилаються. Тому можна конвертувати навіть непублічні зображення.

Чим webp кращий за jpg і png

Той самий кадр, та сама якість на око — але помітно менший файл.

JPG / PNG

Старі формати

Працюють усюди, але важать більше за потрібне.

  • JPG не вміє прозорість
  • PNG із фото величезний
  • Немає анімації в одному файлі
vs
WebP

Сучасний формат

На 25–35% легший за jpg тієї самої якості й уміє все, що вміли обидва старі.

  • Прозорість як у PNG
  • Стиснення краще за JPG
  • Підтримка в усіх браузерах

Формат підтримують усі сучасні браузери з 2020 року, тому запасний варіант у jpg сьогодні потрібен хіба що для дуже старих пристроїв.

Як готувати картинки для сайту

Спершу обріжте до потрібного розміру Картинка 4000 пікселів завширшки в блоці на 800 — це втричі більший файл без жодної користі. Стиснення цього не виправить.
Якість 80 достатньо Різницю між 80 і 100 неозброєним оком не видно, а файл менший удвічі. Для фону можна опускатись і до 70.
Різні розміри для екранів Телефону не потрібна та сама картинка, що й монітору. Атрибут srcset віддає кожному свій варіант.
Відкладене завантаження Картинки нижче екрана вантажаться, коли до них доходить прокрутка. Один атрибут loading="lazy" у теговi.

Коли webp не підходить

Друк Типографія працює з tiff або pdf. Для макета webp не годиться взагалі.
Логотип із чіткими лініями Для іконок і логотипів кращий svg: він масштабується без втрат і важить менше за будь-який растр.
Фото на редагування Кожне перезбереження зі стисненням псує якість. Оригінал зберігайте окремо в повній якості.
Старі поштові програми У листах webp підтримується не всюди. Для розсилок безпечніше лишатись на jpg.

Часті запитання

Наскільки WebP легший за JPG?
Зазвичай на 25–35% при однаковій візуальній якості, а для зображень із великими однотонними ділянками — до 50%. Для сайту це найдешевший спосіб прискорення: сторінка на 2 МБ картинок після конвертації важить близько 1,3 МБ, і на мобільному інтернеті різницю видно одразу. Наш аудит швидкості окремо перевіряє, чи використовує сайт WebP.
Яку якість обрати?
Для фотографій на сайті оптимально 75–85: різниці з оригіналом око не бачить, а вага падає в рази. Нижче 60 з’являються помітні артефакти на градієнтах і межах об’єктів. Для скриншотів, логотипів і графіки з текстом краще брати PNG або тримати якість 90+, бо саме на різких лініях стиснення з втратами помітне найбільше.
Чи всі браузери підтримують WebP?
Так. Chrome, Firefox, Edge та Opera підтримують формат багато років, Safari — з версії 14 і всі iOS від 14-ї. Тобто станом на сьогодні окрема запасна копія в JPG потрібна хіба що для дуже старих пристроїв. Якщо все ж хочете підстрахуватись, використайте тег picture із двома джерелами — браузер сам обере доступний формат.
Чи зберігається прозорість при конвертації?
У WebP і PNG — так, прозорий фон переноситься без змін, і ми окремо позначаємо це у списку файлів. JPEG прозорості не підтримує в принципі: там замість неї підкладається білий фон, і ми теж про це попереджаємо. Якщо у вас логотип чи іконка з прозорим фоном, обирайте WebP — він і прозорість збереже, і важитиме менше за PNG.
Telegram Viber Подзвонити