Alt (Альт) – це атрибут для тега img, у якому встановлюється альтернативний текст для зображення. Текстова інформація відображається при вимкненому завантаженні графіки в браузері користувача і дає зрозуміти, що зображено на цій картинці. Назва «alt» HTML-тег отримав від слова alternative – альтернативний варіант тексту.
Навіщо заповнювати атрибут alt
У пошуковій системі індексується не тільки текст, але й графічна інформація, і зображення – одне з джерел додаткового трафіку. Щоб показувати релевантні зображення при пошуку за картинками, Google і Яндекс орієнтуються на теги, у яких і написано, що представлено на них. Завдяки цьому в результатах пошуку користувач отримує саме те, що шукав. Пошуковий робот же в першу чергу орієнтується на зображення з атрибутом alt, тому з точки зору seo-оптимізації це дуже важливий пункт. Наприклад, якщо у вас на сайті розміщено понад 1000 зображень у сотнях статей, то кожне з них може принести додатковий трафік. Відвідувачі побачать атрибут alt тільки у випадку вимкнення завантаження зображень або при поганому з’єднанні Інтернету. Завантаження графічних елементів здійснюється після отримання інформації браузером, тому заміщуючий текст на екрані монітора видно раніше. Атрибут alt допоможе тільки при пошуку картинок, тому на органічну видачу ніяк не вплине.
Правила правильного заповнення alt
Для досягнення максимального результату від заповнення тегів alt потрібно дотримуватися наступних правил. Пошукові системи ігнорують довгі описи, тому регулюйте довжину alt до 5–6 слів, але не перевищуйте 200–250 символів. Опис зображення має чітко відповідати його змісту. Наприклад, безглуздо вставляти фразу «домашній кіт» для зображення з автомобілем. Для збільшення ефекту від оптимізації картинок рекомендується використовувати ключові слова з тега H1 або заголовка статті, але тільки в тому випадку, якщо вони схожі за змістом. Не використовуйте в тексті велику кількість ключових слів, не допускайте спаму в описі. Не оптимізуйте атрибути alt у зображень, які відносяться до фону вашого сайту, елементів меню. У них тег має бути порожнім або взагалі відсутнім. Зображення для елементів дизайну за можливості можна виносити в CSS-спрайти. Не придумуйте додаткові теги alt для схожих картинок з одного матеріалу або товару. Наприклад, у вас інтернет-магазин курток, у кожної кілька фотографій. Це означає, що для всіх ви пишете одну й ту ж назву, тільки можете додати цифри 1, 2, 3 для розмежування.
Найцікавіше з нашого блогу:
Корисні посилання
