Во все основные картинки на ваших страницах следует добавлять alt-текст. Корректное название технологии — Image Alt Attributes, но, в основном, большинство людей называют просто alt-тегом или alt-текстом.
В атрибуте alt помещается текстовое описание графического элемента страницы. Текст всплывает на экране при наведении курсора мыши на графический элемент. Люди с ослабленным зрением используют содержание атрибута alt, чтобы с помощью специального программного обеспечения озвучивать описание изображений.
Пример тега <IMG> (атрибут alt выделен полужирным) в HTML-коде сайта:
<IMG src="bouquet-photo.jpg" alt="Весенний свадебный букет" widht=123 height=52>
Большинство ПМ не умеет индексировать изображения, зато умеет индексировать текст, описывающий эти изображения. Таким образом, атрибут alt может повлиять на соответствие сайта определенному запросу. Многие разработчики избегают или забывают использовать alt, теряя замечательную возможность предоставить ПМ дополнительную информацию о сайте и помочь посетителям с ослабленным зрением воспринять его содержание.
Естественно, что alt-текст имеет меньший вес, чем обычный текст документа. Иначе говоря, веб-страницы с текстовыми меню и богатыми ключевыми словами ссылками будут индексироваться гораздо лучше, чем такие же страницы с меню в виде картинок, содержащими alt-теги.
Мы нашли интересное исследование, проведенное владелицей HighRanking.com Джил Валенн. Вот некоторые выводы от проведенного исследования:
оказалось, что Google не индексирует alt-тексты с ключевыми словами у тех изображений, которые не работают как ссылки;
Google индексирует alt-тексты изображений, которые служат ссылкой, и выводит их в результаты поиска по ключевым словам;
Google индексирует слова, расположенные только в alt-тегах (не обязательно, чтобы данные слова были расположены где-либо еще на странице сайта).
Можно сделать текст в alt-теге изображения более симпатичным, если у пользователя произошел сбой при загрузке страницы или просто в браузере отключена функция автоматической загрузки рисунков. Например, вот так выглядит баннер, когда у пользователя страница загрузилась полностью, включая все стили и картинки.
Однако если у пользователя изображение не загружается, то, вероятнее всего, он просто-напросто отключил автоматическую загрузку картинок или использует медленное соединение dial-up. В каждом из этих случаев на месте этого изображения появятся описанный вами alt-тег и DIV-тег. Выглядит довольно скромно и скучно.
Есть вариант исправить положение вещей, используя каскадные таблицы стилей (CSS). Расположив изображение внутри тега <DIV>, вы сможете отформатировать текст, расположенный в alt-теге этого изображения, сделать его цветным и притягательным.
Таким образом, посетитель увидит отформатированный, стилизованный текст, отлично смотрящийся на странице. Вы можете задать любые параметры текста, шрифта, размера, границ, отступов, высоты строк и т. д. в зависимости от обстоятельств и ваших потребностей. Кстати, поместив изображение в тег стилизации параграфа CSS (<р style='...'> ... </р>), вы также получите отличный результат.
К сожалению, такой способ сработает только для посетителей сайта, использующих Firefox. Пользователи Internet Explorer (IE) увидят пустую рамку изображения и нестандартный отформатированный текст.
В IE изменяется только цвет текста. Однако мы надеемся, что в новых версиях IE эта полезная функция будет реализована.
ПРЕДОСТЕРЕЖЕНИЕ
Мы не советуем вам применять подобную тактику ко всем изображениям — только к самым важным, без которых посетители не смогут получить необходимую информацию. Чрезмерное использование этого тега просто перегрузит и безосновательно увеличит исходный код вашего сайта.
Следует также отметить, что содержимое атрибута alt в Яндексе будет учитываться только в поиске по картинкам, Google будет учитывать данный атрибут также и в основном поиске.
