Повільний сайт дратує. Але ще прикріше, коли гальмує не код і не хостинг, а просто зображення, які ніхто не спромігся стиснути. Google PageSpeed Insights під час кожного аудиту підсвічує «оптимізуйте зображення» червоним, а ви втрачаєте позиції у видачі й терпіння відвідувачів.

З 2015 року Google використовує швидкість як фактор ранжування. Зображення займають понад половину ваги середньої сторінки, їх стиснення дає найшвидший і найпомітніший приріст продуктивності. Один плагін закриває це завдання повністю.

EWWW Image Optimizer, безплатний інструмент із понад 1 мільйоном активних установок, який стискає JPG, PNG, GIF і WebP прямо на вашому сервері, без сторонніх API та лімітів. У цьому посібнику, покрокове налаштування від установлення до масової оптимізації та перевірки результату.

💡 Швидкий огляд:

• Установіть EWWW Image Optimizer і перевірте сумісність сервера, плагін сам покаже, чого бракує
• Налаштуйте рівні стиснення: lossless для PNG/GIF, якість JPG 80, PageSpeed перестане скаржитися на зображення
• Увімкніть конвертацію у WebP і пропишіть правила перезапису, формат Google зменшує розмір на 60% без втрати якості
• Запустіть Bulk Optimizer для всіх наявних зображень і перевірте результат у PageSpeed Insights

1. Установлення та перевірка сумісності сервера

Установіть плагін через адмінку WordPress або завантаживши ZIP із wordpress.org. Одразу після активації зайдіть у Налаштування → EWWW Image Optimizer.

Перше, що ви побачите,, блок «Статус плагіна». Зелені галочки означають, що все необхідне встановлено. Червоним підсвічено відсутні модулі: jpegtran для стиснення JPG, optipng для PNG, gifsicle для GIF і cwebp для конвертації у WebP. Більшість хостингів вмикають їх за замовчуванням, але якщо чогось немає, зверніться до підтримки хостера. Плагін також пропонує хмарну оптимізацію через Compress API, коли локальні утиліти недоступні.

На цьому етапі не зайвим буде зазирнути до розділу швидкості завантаження WordPress, оптимізація зображень, лише один із 21 прийому, які в сумі дають зелену зону в PageSpeed.

2. Базове налаштування плагіна

Вкладка «Основні налаштування», тут ми задаємо фундамент роботи плагіна.

API-ключ для хмарної оптимізації. Не обов’язковий. Розробник дає безплатні кредити на тестування хмарного режиму в обмін на згоду надсилати анонімну статистику використання. Але локальні утиліти справляються не гірше й без обмежень, для більшості сайтів вистачить саме їх.

Видалення метаданих. Позначку варто поставити. Смартфони й камери вшивають у файли EXIF/IPTC-теги, координати зйомки, модель пристрою, дату. Це зайва вага й потенційний витік приватності. Клієнти часто не підозрюють, що їхні фото зберігають GPS-координати.

Рівні стиснення. Для JPG, PNG і GIF вибирайте «Без втрат» (Lossless). За даними розробника, середня економія на lossless-стисненні становить 8% від початкового розміру. PDF-файли залиште без стиснення: по-перше, це преміум-функція, по-друге, PDF зазвичай віддають для завантаження, і їхній розмір не впливає на швидкість завантаження сторінки.

3. Розширені налаштування та якість JPG

Вкладка «Додаткові налаштування» містить параметри, які безпосередньо впливають на результати PageSpeed Insights.

Якість JPG. WordPress за замовчуванням стискає JPG на рівні 82. Я рекомендую поставити 80, різниця для ока непомітна, а PageSpeed перестає скаржитися на «неоптимізовані зображення». На десятках сайтів це налаштування жодного разу не дало хибного спрацювання.

Паралельна та запланована оптимізація. Якщо у вас бізнес-сайт із рідкісними завантаженнями зображень, ці опції можна не чіпати. Ручний запуск Bulk Optimizer за потреби, достатній сценарій. На потужному сервері з частими публікаціями вмикайте scheduled optimization.

Папки для оптимізації. Під час масового прогону плагін сканує дві останні папки медіабібліотеки. Цього майже завжди достатньо. Якщо виявили пропущені каталоги, додайте їх вручну, але одразу після цього натисніть «Зберегти». Перехід на іншу вкладку до збереження скидає введені шляхи, відома особливість плагіна.

Опції «Увімкнути вбудовану довідку» та «Дозволити відстеження використання», на ваш розсуд.

4. Зміна розмірів зображень

Головне, що варто увімкнути,, «Дозволити зміну розміру наявних зображень». Якщо картинка шириною 2000 пікселів вставлена в колонку 480 пікселів, CSS масштабує її візуально, але браузер однаково завантажує повноваговий файл. Це налаштування обрізає реальний розмір до потрібного.

Image Detective, корисна фіча для аудиту. Коли її ввімкнено, ви бачите на сайті (будучи залогіненим) зображення, які завантажуються в більшій роздільній здатності, ніж відображаються. Швидкий спосіб знайти кандидатів на ресайз без ручного перебору медіабібліотеки.

5. Конвертація у WebP

WebP, формат від Google, який за порівнянної якості важить на 25-35% менше за JPG і на 60% менше за PNG. Усі сучасні браузери його підтримують. EWWW уміє автоматично генерувати WebP-версії для кожного завантажуваного зображення.

Увімкніть опцію «JPG/PNG у WebP». Поля Force WebP, WebP URLs та Alternative WebP Rewriting залиште порожніми, стандартного механізму достатньо для більшості конфігурацій.

Ключовий крок, натиснути кнопку «Вставити правила перезапису». Плагін додасть директиви в .htaccess, які віддають браузеру WebP-версію файлу, коли він її підтримує. Після успішного вставлення індикатор зміниться з червоного «PNG» на зелений «WEBP».

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

6. Масова оптимізація через Bulk Optimizer

Усі налаштування задано, тепер стискаємо наявну медіабібліотеку.

Перейдіть у Медіафайли → Bulk Optimizer. Під час першого запуску прапорці примусової переоптимізації та паузи між зображеннями не потрібні. Натисніть «Сканувати неоптимізовані зображення», з'явиться прогрес-бар.

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

Якщо після прогону PageSpeed усе ще позначає окремі файли, скопіюйте шлях до папки та додайте його до списку оптимізованих каталогів, потім запустіть сканування повторно.

7. Перевірка результату

Відкрийте Google PageSpeed Insights і введіть URL пари сторінок сайту. Аудит «Serve images in next-gen formats» та «Efficiently encode images» має показати зелений статус.

Різниця в числах виглядає скромно: економія 16-30 КБ на одному зображенні. Але помножте на 50 картинок на сторінці та на тисячі переглядів на місяць: сукупний ефект вимірюється вже мегабайтами трафіку та секундами завантаження. Для мобільних відвідувачів на повільному з'єднанні це різниця між «залишитися» та «закрити вкладку».

Якщо хочете копнути глибше, ось 21 прийом пришвидшення WordPress, який охоплює не лише зображення, а й кешування, скрипти, шрифти та базу даних.

У відео нижче, наочне встановлення та налаштування EWWW Image Optimizer за 8 хвилин.

⁉️🤔 Часті запитання

Плагін стискає оригінали чи створює копії?

За замовчуванням EWWW замінює вихідний файл оптимізованою версією, але лише якщо вона МЕНША за оригінал. Плагін ніколи не зробить зображення важчим. На вкладці «Конверсія» можна увімкнути збереження бекапів, оригінали залишаться в окремій папці wp-content/ewww/backup/.

Що робити, якщо сервер не підтримує локальні утиліти стиснення?

Увімкніть хмарний Compress API. Він безплатний для lossless-стиснення JPG і конвертації у WebP. Потрібно лише дозволити анонімну статистику використання в налаштуваннях. Якщо і цей варіант не підходить, розгляньте альтернативи на кшталт ShortPixel або Smush.

Як перевірити, що WebP віддається браузеру?

Відкрийте DevTools (F12) → вкладка Network → відфільтруйте за типом Img. У стовпці Type для зображень вашого сайту має бути webp. Альтернативний спосіб: в адресному рядку браузера відкрийте пряме посилання на зображення з сайту, Chrome і Firefox покажуть WebP-версію, якщо вона є.

Bulk Optimizer завис на середині, що робити?

Оновіть сторінку та запустіть заново. Плагін запам’ятовує прогрес і продовжить із того самого місця. Якщо проблема повторюється, збільште значення паузи між зображеннями в налаштуваннях і спробуйте вилучити особливо важкі файли з черги через фільтр ewww_image_optimizer_timeout.

Чи потрібен EWWW, якщо хостинг вже стискає зображення?

Стиснення на хостингу зазвичай працює на льоту і не змінює вихідний файл, воно обслуговує кешовану версію через свій CDN. EWWW оптимізує самі файли в медіабібліотеці. Найкраще працюють разом: EWWW зменшує оригінали, хостинг-кеш роздає їх швидко. Вимкніть дублювальні функції (наприклад, подвійну конвертацію у WebP), якщо вони перетинаються.

Що змінилося в EWWW до 2026 року?

Плагін активно розвивається. У версіях 8.x з’явилася нативна підтримка AVIF, формату наступного покоління, який за тестами розробників AVIF дає виграш до 50% до розміру файлу порівняно з WebP за тієї самої якості. Щоправда, AVIF-конвертація поки що в преміум-підписці через Easy IO CDN.

Lazy Load з авто-масштабуванням тепер вбудований у безплатну версію і коректно резервує місце під зображення — це прибирає Cumulative Layout Shift, за який PageSpeed теж штрафує.

Якщо вам потрібне просте, готове до роботи «з коробки» рішення для оптимізації зображень, EWWW Image Optimizer залишається одним із найкращих безплатних варіантів. Налаштуйте один раз за кроками з цього посібника і забудьте про червоні попередження в PageSpeed.

🔗 EWWW Image Optimizer на WordPress.org