Alt-теги і як їх писати

Що важливо зрозуміти за темою «Alt-теги і як їх писати»

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

Є два головні призначення alt-тега. Перше — доступність. Скрінрідери, якими користуються люди з порушеннями зору, читають вміст alt-атрибута вголос. Якщо тега немає або він порожній, людина просто не дізнається, що там за картинка. Друге — пошукова оптимізація. Google не бачить пікселі, але розуміє текст. Коректний alt-тег допомагає пошуковику зрозуміти контекст зображення й показати його в картинковій видачі.

Часта плутанина: alt-тег і title-тег — це різні речі. Title з'являється як підказка при наведенні курсора, а alt — це саме текстова альтернатива зображенню. Для SEO значення має саме alt.

Практичні особливості та варіанти застосування

Як формулювати опис

Правило просте: описуйте те, що бачите, конкретно й лаконічно. Уявіть, що пояснюєте картинку людині по телефону.

• Погано: «фото», «зображення 1», «pic123»
• Погано: «красивий закат над морем дуже гарний світло яскравий»
• Добре: «закат над Чорним морем у Одесі»

Оптимальна довжина — 10–15 слів. Більше не означає краще: Google читає приблизно перші 125 символів, далі текст просто обрізається без жодної користі.

Коли alt-тег має бути порожнім

Не кожне зображення потребує опису. Декоративні елементи — розділювачі, фонові патерни, іконки, що дублюють текст поруч, — краще залишати з порожнім атрибутом: alt="". Це не помилка, а свідома практика. Скрінрідер просто пропустить таку картку, і людина не буде змушена слухати «зображення-розділювач».

Де писати alt-теги у різних CMS

Чи потрібні ключові слова в alt-тегах

Так, але без примусу. Якщо зображення органічно пов'язане з ключовим словом сторінки — включіть його. Наприклад, для сторінки «купити ноутбук Lenovo» alt-тег головного фото може звучати як «ноутбук Lenovo IdeaPad 3 сірий, вид збоку». Ключове слово є, але воно вписане природно, а не штамповано.

Помилки, обмеження та що враховувати на практиці

Переспам ключовими словами

Alt-тег «купити ноутбук недорого ноутбук львів ноутбук ціна» — це не оптимізація, а тригер для фільтрів Google. Пошукова машина давно розпізнає перевантаження ключами й може знецінити сторінку. Один релевантний ключовий словник на зображення — достатньо.

Опис того, чого немає на картинці

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

Копіювання заголовка сторінки в alt-тег

Заголовок H1 описує всю сторінку. Alt-тег описує конкретне зображення. Якщо на сторінці десять фото, і в кожному alt стоїть заголовок сторінки — це марно й підозріло. Кожна картка заслуговує на власний опис.

Ігнорування масових завантажень

Коли на сайт завантажують сотні фото товарів чи фотографій з події, alt-теги часто залишають порожніми. Це втрачена можливість. Навіть базове найменування — «чоловічі чорні шкіряні черевики Clarks» замість «DSC_4521» — дає пошуковику конкретику для індексації.

Що ще варто врахувати

• Alt-тег не вирішить проблеми важких зображень — це завдання стиснення та формату (WebP, AVIF). Alt працює з контекстом, а не з вагою файлу.
• Якщо зображення є посиланням, alt-тег замінює текст анкора. Тому для картинок-кнопок опис має бути дієсловом: «Перейти до каталогу», а не «стрілка вправо».
• Перевірте alt-теги наявного сайту аудитором чи через Screaming Frog — часто виявляються сотні зображень із порожнім alt або з генерованим CMS текстом на кшталт «image-001».

Alt-теги — невеликий, але системний елемент On-Page SEO. Коли кожне зображення на сайті має точний, чесний опис, пошукова машина отримує цілісну картину сторінки, а сайт стає доступнішим для всіх користувачів.