Важен ли атрибут ALT для изображений?

Что такое атрибут ALT?

Атрибут ALT, или альтернативный текст, — это описание изображения, которое, если картинка не загрузилась или её невозможно прочитать (например, ботами или пользователями с нарушениями зрения), подаётся как подстраховка нашего контента.

Зачем нужен атрибут ALT у изображения?

Главная задача атрибута ALT — обеспечить доступность сайта для тех пользователей, которые не могут нормально рассмотреть изображения. Пример — люди, которые пользуются скринридерами: как понятно из названия, это программы, читающие содержимое экрана вслух.

Когда такая программа доходит до изображения, описать саму картинку она не может, поэтому берёт альтернативный текст и даёт пользователю контекст — что на этом фото могло бы быть видно. Так пользователь корректно перемещается по сайту и не «теряет» информацию из изображений.

Почему тег ALT важен для SEO?

Наша работа как SEO-специалистов — дать Google как можно больше информации, чтобы он понял наш контент и, соответственно, показал его нужным пользователям.

Да, Google сильно продвинулся в обработке изображений и, вне всяких сомнений, в общих чертах понимает содержимое картинки, но атрибут ALT нашим изображениям прописывать всё равно стоит. Так мы гарантируем, что у Google есть вся информация о фото и он понимает его смысл внутри нашего контента.

Как мы уже сказали, использовать их лучше по делу и не пытаться «обмануть» Google дурными способами. Иначе говоря, нет смысла ставить в контент фотографию машины, а в альтернативном тексте писать «дешёвые кроссовки». Они друг с другом не связаны, и это может вызвать вопросы (особенно если альтернативный текст используют для переспама ключевыми словами).

Используйте фотографии и альтернативные тексты, связанные с вашим контентом. Лучше всегда придерживаться этого правила и включать в альтернативный текст основной ключ, второстепенный, какой-нибудь семантически близкий термин и так далее. Обычно с этим не возникает сложностей, потому что вписать их получается естественно.

Как добавить тег ALT к изображению

Наверняка вы уже думаете: как добавить этот альтернативный текст на свой сайт?

Не переживайте, мы поможем. Смотрите внимательно: разберём, как это делается в двух самых популярных CMS.

Как добавить атрибут ALT к изображению в WordPress

Здесь всё довольно просто. Нужно зайти в медиабиблиотеку, выбрать фотографию и заполнить поле, предусмотренное для альтернативного текста:

Чтобы дать чуть больше контекста, можно заодно заполнить подпись и описание, как на изображении. Кроме того, это можно сделать прямо в редакторе статьи в момент добавления картинки.

Как добавить атрибут ALT к изображению в PrestaShop

В PrestaShop нет ни медиабиблиотеки, ни отдельного поля для этого.

Так как же его добавить?!

Не переживайте, сейчас расскажем хитрость. Нужно заполнить поле подписи внутри изображений товара:

В большинстве тем то, что вы впишете в поле Caption, подставится как атрибут ALT редактируемого изображения.

Проблема в том, что в этой CMS добавлять атрибуты ALT очень муторно: делать это приходится по одному. Поэтому в нашем руководстве по SEO в PrestaShop мы упоминали модуль, который позволяет быстро проставить ALT всем изображениям.

Как посмотреть атрибут ALT у изображений

Теперь объясним, как проверить, есть ли у сайта атрибуты ALT на изображениях. Вариантов два:

Через инспектор

Если вы пользуетесь Chrome, кликом правой кнопкой мыши на любом сайте можно открыть инспектор. Внутри достаточно выбрать изображение и посмотреть ALT:

Слегка запутанно? Возможно, но не переживайте: у нас есть ещё один вариант, попроще:

Через расширение для Chrome

В этом случае советуем поставить SEO-расширение для Chrome под названием Web Developer. Когда оно установлено, достаточно нажать на иконку шестерёнки и выбрать images > Display Alt Attributes:

Как только вы включите эту опцию, рядом с каждым изображением появится маленькая подсказка с его атрибутом ALT:

Вывод

Как видите, атрибуты ALT — это SEO-фактор, о котором часто забывают, но который может дать вам небольшой дополнительный плюс внутри вашей SEO-стратегии.

Помните: всегда выбирайте фотографию, которая соответствует тексту, чтобы пользователь не запутался, когда её увидит, и пишите альтернативный текст, описательный и релевантный и для пользователя, и для нашего дорогого друга Google.

Как всегда, ждём в комментариях любые ваши вопросы :)