Главная
→
Блог
→
Как прописать ALT и TITLE для изображений без ошибок

Как прописать ALT и TITLE для изображений без ошибок

Рекомендации, результаты экспериментов, разбор частных вопросов – эта статья расскажет, как настроить атрибут alt корректно.

Что такое атрибуты ALT (альт) и TITLE (тайтл)?

Атрибут альт – это текст, альтернативный изображению.

Бывают случаи, когда вместо картинки загружается только текст описания. SEO альт текст изображений – это не описание картинки, не её подпись, а тот текст, который браузер может показать ВМЕСТО рисунка.

Зато сама подпись к фото располагается в атрибуте title.
Она может быть видна посетителям, когда те наводят курсор на картинку.

Синтаксис тега IMG или html-код для атрибута alt + title выглядит так:


<img src=”foto.jpg” alt=”Описание картинки foto” title="Встплывающая подсказка к foto" />

Порядок расположения атрибутов может быть любой.

Зачем нужен мета тег альт (alt) для изображений?
Можно ли обойтись без него?

Отсутствие атрибутов, конечно, не имеет отношения к работоспособности сайта. Но они просто необходимы, когда речь идёт о SEO, а также об удобстве посетителей.

При медленном интернете фото могут не загрузится, тогда вместо них отображаются только описания (альты)

Бывают случаи, когда люди сами изменяют настройки браузера или телефона, отключая любую загрузку фото. Причины могут быть разные – экономия трафика, желание ускорить загрузку страниц, старая модель телефона.

А теперь самое важное, зачем нужно прописывать тег alt для изображений.

С помощью атрибутов тега img можно возглавить поисковую выдачу по изображениям. Особенно это актуально интернет-магазинам. Рисунки без смыслового описания поисковиками не ранжируются, т.к. их невозможно найти по запросам пользователей, ведь атрибут alt у тега не прописан.

Как не нужно прописывать alt

Это скриншот при плохом интернете. Обратите внимание: прописан альт тег на скорую руку и не продуманы с точки зрения SEO (man, номер 1, номер 2, номер 3).

Можно ли оставлять альт пустым, обязательно ли подписывать?

Правила Яндекса подчеркивают: атрибут alt особенно необходим тем сайтам, где большое количество фотоконтента. Поэтому нежелательно оставлять его пустым, особенно если Вы хотите получать трафик из поисковых систем через картинки. Если изображение имеет пустой атрибут alt или он вовсе отсутствует – это значит, что трафика из поисковой выдачи по картинкам не получить.

Изображения без атрибута alt допускаются у небольших рисунков (менее 150 пикселей), которые поисковая система расценивает как иконки, т.е. игнорирует.

Как верно заполнять атрибут alt для попадания изображений в топ поисковой выдачи?

Большую SEO-роль при ранжировании картинок играют следующие факторы:

Высокое качество фото, небольшой вес
Высокое качество фото, но при этом небольшой вес (от него зависит скорость загрузки страницы).

Кстати, гугл рекомендует указывать ширину/высоту картинки (атрибуты
«width»/«height»), чтобы некоторые браузеры могли зарезервировать место под изображение, продолжив загрузку страницы без ожидания загрузки фото.

Сжать изображение без потери качества можно с помощью сервиса TinyPNG.

Фото располагают максимально близко к относящемуся seo-тексту

Название
Название файла с изображением (не путать с альт и тайтл!) раскрывает его суть. Лучше писать название транслитом + тире вместо пробелов между слов. Пользуйтесь онлайн сервисами seo-транслитерации – выбор бесплатных широк.

Тексты ссылок (анкоры) на картинки

Корректно прописанные подписи картинок: теги alt (альт) и title (тайтл) изображения

SEO-рекомендации по правильному формированию подписей картинок

Уникальность подписи

Для магазина легко использовать название товара, его тип, модель, уникальных характеристик (цвет, материал, размер). Если требуется несколько фото одного товара, то можно добиться уникальности:

вид 1, вид 2…
вариант 1, вариант 2…
фото 1, фото 2…
рисунок 1, рисунок 2…

В таком случае легко попасть в топ выдачи сразу несколькими рисунками одного сайта (даже одной страницы).

2. Размер подписи:

min 3 слова
max 250 символов (+ экспериментально выяснено, что лучше уложиться до 15 слов, даже если они короткие)

3. Используются ключевые фразы, но нет переспама

По рекомендации Яндекс необходимо использовать только те ключевые слова, которые относятся к картинке, описывая ее содержание.

Если у вас интернет-магазин, воздержитесь от описательных фраз. Например, вместо «веселые дети играют конструктором лего» напишите «набор LEGO Пиратский корабль».
Откажитесь от использования чистых коммерческих запросы «заказать, сколько стоит, купить, цена»

4. Соответствие описанию

Описание изображения должно максимально соответствовать содержимому фото. Заранее хорошо продумайте, что писать в атрибут ALT у картинки, а также что прописать в TITLE к ним.

Могут ли атрибут alt (альт) совпадать с атрибутом title (тайтл) для изображения?

Напомню, арибут title – это название изображения, которое появляется у некоторых CMS при наведении курсора на фото. Не забудьте, что тайтл виден посетителям – формулируйте его человекопонятным языком. Атрибут тайтл пишется для посетителей сайта! Кто-то даже советует использовать атрибут title как дополнительную информацию о преимуществах товара/услуги.

Альт (alt) текст для изображений пишется поисковым системам, т.е. является частью SEO работ.
Alt и title фото могут совпадать. В top поисковой выдачи по картинкам попадаются оба варианта. Техподдержка Яндекс тоже разрешает совпадение.

Могут ли атрибут alt (альт) совпадать с тегом title (тайтл) страницы или заголовками h1, h2, h3?

Одно из требований к альт-текстам – их уникальность, поэтому 100%-ные совпадения исключены.

Но это правило легко обойти – достаточно разбавить заголовок словами «рисунок, фото, картинка». Есть мнение, что для alt (альт) стоит указывать те же самые ключевые фразы, что в тегах title страницы или Н1-Н3 (в зависимости от расположения фотографии).

Кстати, логика здесь есть, ведь рекомендуется размещать картинку поближе к связанному с ней тексту.

Не забудьте только проверить соответствие подписи остальным seo-рекомендациям.

Как подписывать изображения, если фото находится и на странице категории, и на карточке товара?

Поисковые системы даже при ранжировании фотографий могут использовать сопутствующий текста на странице. При разных поисковых запросах, но одинаковых alt описаний изображений в выдачу могут попасть картинки совершенно с разных страниц.

Поэтому можно продублировать атрибуты на обоих страницах (категория, карточка товара, подборка товаров по определенному признаку).

Конечно же, сомневающиеся могут перестраховаться и добавить к alt слова типа «подборка по цвету», «изображение товара», «категория».
Это уже на вкус seo-оптимизатора.

Что делать, если вместо alt и title высвечиваются иероглифы?

Такое изредка бывает, когда альт и тайтл написаны по-русски, а кодировка отличается от UTF-8. Ничего страшного, просто приведите свою кодировку к нужному формату.

В любом случае при рускогоговорящей аудитории сайта оба атрибута следует прописывать на русском языке.