Коротка відповідь: щоб перевірити зображення на сторінці SEO, вставте її адресу у безкоштовну Перевірку SEO зображень PromoPilot. Інструмент розбере до 100 тегів <img>: чи є alt, чи варто loading="lazy", чи задані width і height, чи використовуються WebP, AVIF або SVG і чи є srcset. Підсумок — оцінка від 0 до 100 та зауваження щодо кожної картинки. Нижче - як вважається бал, що лагодити першим і чого інструмент не бачить.
Я 12 років роблю сайти і магазини, і картинки — головне «гальмо» майже кожного з них. Типова картка товару: п'ять фото по 3 МБ прямо з камери, порожній, а ім'я файлу - IMG_4512.jpg.
Що перевіряє Перевірка SEO зображень?
Інструмент дивиться на кожну картинку сторінки за п'ятьма ознаками та складає їх у загальну оцінку.
| Що перевіряє | Що дивиться | Навіщо це для SEO та бізнесу |
|---|---|---|
| Alt | Чи є текстовий опис кожного <img> | Google Картинки ранжують за alt; доступність для незрячих |
| Lazy loading | Атрибут loading="lazy" у картинок нижче першого екрану | Сторінка не вантажить те, до чого відвідувач ще не догортав |
| Width та height | Чи задано розміри в атрибутах тега | Блоки не «стрибають» під час завантаження – це метрика CLS |
| Формат | WebP, AVIF або SVG для розширення файлу | Сучасні формати важать помітно менше JPG та PNG |
| Srcset | Чи є варіанти картинки для різних екранів | Телефон отримує маленький файл, а не версію монітора |
Кожна картинка отримує список зауважень, а сторінка – підсумковий бал. Це зручно: видно не лише «щось не так», а й яка саме картинка винна.
Як перевірити зображення на сайті онлайн?
- Відкрийте Перевірку SEO зображень.
- Вставте адресу сторінки — краще за ту, де багато фото: картка товару, категорія, стаття блогу, портфоліо.
- Натисніть кнопку «Перевірити» та дочекайтеся сканування всіх зображень.
- Перегляньте оцінку та список зауважень по кожній картинці.
- Виправте проблеми та перевірте сторінку знову.
Так виглядає сторінка інструмента: поле адреси, список перевірок та FAQ.
Як вважається оцінка та що виправити першим?
Оцінка стартує зі 100 балів і за кожну проблему знімаються штрафи — залежно від того, яка частка картинок сторінки її не пройшла. Знаючи правила, легко зрозуміти, що дасть більший приріст.
| Перевірка | Штраф | Коментар |
|---|---|---|
| Alt | менше 50% картинок з alt - −30; менше 80% - −15; менше 100% - −5 | Найвагоміший пункт |
| Lazy loading | менше 50% - 15; менше 80% - −8 | Перші три картинки не враховуються |
| Width та height | менше 50% - 15; менше 80% - −8 | Розміри тільки в CSS не зараховуються |
| WebP, AVIF або SVG | менше 30% - −10 | Формат визначається розширенням |
| Srcset у растрових картинок | менше 30% - −10 | SVG не потрібний srcset |
Звідси мій порядок роботи:
- Alt. Найдорожчий пункт і найпростіший у виправленні. Пишіть, що зображено:
alt="Кожаный рюкзак Nord 20 л, коричневый, вид сбоку", а неalt="рюкзак купить дёшево рюкзак". Для декоративних елементів – порожнійalt="". - Width та height. Вкажіть реальні розміри в атрибутах, а CSS додайте
img { max-width: 100%; height: auto; }— зображення залишиться адаптивним, а макет перестане стрибати. - Lazy loading для всього, що нижче за перший екран. А ось головній картинці (hero) він шкідливий: її потрібно вантажити одразу і з пріоритетом.
- WebP чи AVIF. WordPress підтримує завантаження WebP з версії 5.8, AVIF - з версії 6.5.
- Srcset для великих фото, щоб телефон не качав версію монітора.
Приклад правильної головної картинки та адаптивного фото в тексті:
<img src="/img/hero.webp" alt="Мастерская кожаных изделий Nord" width="1200" height="600" fetchpriority="high"> <img src="/img/bag-700.webp" srcset="/img/bag-700.webp 700w, /img/bag-1400.webp 1400w" sizes="(max-width: 700px) 100vw, 700px" alt="Рюкзак Nord 20 л, вид сбоку" width="700" height="700" loading="lazy">Як написати хороший alt для зображення?
Alt - найвагоміший пункт оцінки, і саме в ньому найчастіше помиляються: або залишають порожнім, або набивають ключами. Просте правило - опишіть картинку людині, яка її не бачить, однією пропозицією.
| Картинка | Поганий alt | Гарний alt |
|---|---|---|
| Фото товару | рюкзак купить рюкзак недорого | Кожаный рюкзак Nord 20 л, коричневый, вид спереди |
| Фото команди | photo1 | Мастера мастерской Nord за работой над сумкой |
| Схема чи графік | график | Рост заказов с сайта по месяцам: с 40 до 120 в месяц |
| Прикраса значок | иконка | порожній alt="" — читати її нема чого |
Для каталогу зручно збирати за шаблоном: назва товару + колір або варіант + ракурс. Тоді п'ять фото однієї картки мають п'ять різних, корисних описів, а не п'ять однакових.
Ім'я файлу також має значення: kozhanyj-ryukzak-nord-korichnevyj.webp краще, ніж IMG_4512.jpg. Перейменовувати старі файли заради цього не варто, а нові завантажуйте відразу зі зрозумілими іменами.
Порівняння: Перевірка SEO зображень та альтернативи
| Інструмент | Що безкоштовно | Обмеження | Кому підходить |
|---|---|---|---|
| PromoPilot — Перевірка SEO зображень | Alt, lazy loading, width/height, формати, srcset; оцінка 0–100 та зауваження щодо кожної картинки | До 100 img, вага файлів не оцінює | Швидкий аналіз картинок будь-якої сторінки |
| Google PageSpeed Insights | Аудити зображень у складі перевірки швидкості: формат, розмір, відкладене завантаження | Змішані з десятками інших перевірок, майже не розбирає | Оцінка впливу картинок на швидкість |
| Squoosh | Стиснення та конвертація однієї картинки у браузері | Не перевіряє сторінку, працює з файлами | Підготовка окремих зображень |
| Screaming Frog SEO Spider | Список картинок без alt по всьому сайту | Потрібна установка, у безкоштовної версії ліміт адрес | Аудиту alt на сотнях сторінок |
Висновок: онлайн-перевірка показує, що не так з картинками конкретної сторінки, PageSpeed — скільки це обходиться за швидкістю, а Squoosh або конвертер допомагають виправити самі файли.
У каталозі PromoPilot 87 безкоштовних SEO-інструментів, серед них - стиснення зображень та конвертер у WebP, які працюють прямо у браузері, без завантаження файлів на сервер. А щоб зрозуміти, скільки важить вся сторінка, завітайте до статті нашої серії про аналіз швидкості завантаження сторінки.
Чого не бачить перевірка зображень?
Чесно про межі інструменту – їх варто знати, щоб правильно читати оцінку:
- Вага файлів не враховується - картинки не завантажуються; формат визначається розширенням.
- Тег
<picture>не розуміється: JPG в<img>буде позначений, навіть якщо в<source>поруч є AVIF або WebP. - Фонові картинки з CSS та зображення, які додає JavaScript, у звіт не потрапляють.
- Розміри, задані лише у CSS, не зараховуються.
- Сторінка без жодного
<img>отримує 50 балів — це не «половина помилок», а «нічого оцінювати».
Коли безкоштовний інструмент мало?
Виправити alt на одній сторінці десять хвилин. Але якщо в магазині п'ять тисяч товарів, то вручну це не зробити. Фахівець потрібен, якщо:
- alt потрібно генерувати автоматично з назви, кольору та ракурсу для всього каталогу;
- картинки завантажуються з камери без стиснення, і потрібний автоматичний конвеєр: стиснення, WebP, кілька розмірів;
- тема сайту виводить фото без width, height і srcset, і лагодити потрібно шаблон;
- хочете отримувати трафік із Google Картинок за товарними запитами.
Що я можу зробити для вашого сайту?
Я Валерій Данюк, розробник та SEO-фахівець: 12 років та 200+ клієнтів, багато інтернет-магазинів із тисячами фотографій.
SEO та аудит
- SEO-аудит сайту під ключ: перевіряю картинки по всьому сайту, налаштовую автоматичну конвертацію та alt у шаблонах.
- SEO-блог з ІІ, який наводить клієнтів з органіки - ілюстрації з alt і WebP у кожної статті автоматично.
Магазини та каталоги
- Каталог на 300 товарів за пару хвилин через MCP та Claude — з описами та фото для кожної позиції.
- Інтернет-магазин WooCommerce з правильною обробкою зображень.
- Перенесення магазину з Instagram на сайт — фото товарів переїжджають разом із описами.
- На 1001site товари, фото та тексти можна перенести за посиланням зі старого сайту або з соцмереж.
Облік та автоматизація
Надішліть посилання на картку товару в Telegram — скажу, скільки можна виграти на картинках.
Підсумок
- Перевірка SEO зображень онлайн розбирає до 100 картинок сторінки та виставляє оцінку 0–100 із зауваженнями щодо кожної.
- Найбільше балів дають alt та розміри width/height; потім lazy loading, WebP/AVIF та srcset.
- Головній картинці lazy loading не потрібен - їй потрібен
fetchpriority="high". - Для великих каталогів обробку фото автоматизують або вибирають платформу, де це вже зроблено, наприклад 1001site.
Перевірте найважчу сторінку свого сайту в безкоштовній Перевірці SEO зображень - і почніть з alt.
Джерела
- Сторінка інструменту «Перевірка SEO зображень» PromoPilot – перевірки, правила оцінки, обмеження та FAQ.
- Google Search Central — рекомендації щодо зображень для пошуку.
- Google PageSpeed Insights і Squoosh - опис можливостей.
