Как прописать Alt и Title для картинок

SEO-оптимизация — это внутренняя «настройка» веб-ресурса для того, чтобы поисковая система (далее — ПС) правильно увидела его содержание. Одним из шагов в SEO-оптимизации является описание изображений при помощи специальных атрибутов.

Alt или Атрибут описания

В Alt вносится текст, описывающий изображение в <img>. Формат: <img src=»путь к картинке»» alt=»текст-описание»>. Этот текст пользователь видит в том случае, если на экране у него по какой-то причине не загрузилось изображение. На его месте появляется текст-описание.

Так выглядит незагруженная картинка без «Альт».

А так — с «Альт»:

Текст-описание в Alt ПС учитывает при индексации страницы, при этом упрощается поиск по картинками.

Также атрибут облегчает веб-серфинг слабовидящим людям. Специальные программы распознают текст с экрана и зачитывают его вслух.

Пример — как можно описать картинку «Немецкая овчарка»

• В качестве описания используется текст типа «Картинка 1» или «Фото 2». Такой текст бесполезен, так как не описывает изображение, не несет пользы для посетителя сайта, не содержит ключевые слова.
• В Alt необходимо написать «Немецкая овчарка» или «Немецкая овчарка чепрачного окраса». Такое описание будет наиболее полным.
• Вариант с описанием «Купить немецкую овчарку» больше подойдет для сайта-питомника. Но так как однотипных фото собак на таком сайте будет много, то данный запрос в каждой картинке лучше конкретизировать, например «Купить немецкую овчарку для племенного разведения». 
• Вариант «Немецкая овчарка купить, купить НО, приобрести немецкую овчарку, овчарка из питомника» и т.п. может восприниматься ПС как спам. А за него поисковики жестко наказывают.

Правила написания Alt

• Длина тега — до 250 символов. Оптимально — до 80.
• Количество слов — не более 5.
• Используйте сжатую, но содержательную информацию.
• Вписывайте «ключи», которые желательно употреблять в именительном падеже.
• Не спамьте — избегайте перечисления множества ключевых слов через запятую.
• Не используйте коммерческий запрос, например, слово «купить», если он не относится к изображению непосредственно.
• Описание в Альт должно относиться к контенту страницы и описывать картинку наиболее точно.

Пример Alt с ключевыми словами:

Атрибут Title или Дополняем картинку заголовком

Текст, который написан в теге Title, всплывает над изображением при наведении на него курсора мыши. В Title вносится текст так же в теге <img>. 

<img src=»путь к картинке»» title=»заголовок-описание»>. 

Если посетителю трудно понять, что показано на картинке, он наводит курсор мыши на нее. Тайтл — это подсказка, необходимая для улучшения поведенческих факторов. ПС не придает большого веса заголовку, но косвенно повлиять на SEO вы с его помощью сможете.

Так выглядит изображение с прописанным Title при наведении курсора:

Требования к Title те же, что и к Alt — определенное количество символов, наиболее точное описание, отсутствие спамности, применение ключевых запросов.

Важно! Текст в Title могут видеть только пользователи за компьютерами. Поэтому если вы через этот тег хотите донести до них важную информацию — разместите ее в виде обычного текста.

Резюме

• Alt используйте обязательно, а Title — по возможности.
• Писать контент в атрибутах можно с заглавных или прописных букв.
• Для русскоязычного сайта используйте кириллицу.
• Оптимизируйте картинки в любое время — как до, так и после заполнения атрибутов.

Создавайте правильные описания к изображениям и помните: в SEO нет мелочей!