Использование атрибутов title и alt

Не повторяйте текст ссылки в атрибуте title

Стандартные шаблоны прилагающиеся к различным CMS часто повторяют текст ссылки в навигационных ссылках в каждом атрибуте title.

Я не знаю зачем. Может быть разработчики верят что это повысит доступность (accessibility) то то что нравится поисковикам. В любом случае, повторение текста ссылки в атрибуте title не делает конечному пользователю ничего хорошего.

Всё что происходит это раздражающие повторы и увеличение веса страницы. Имеет место указывать текст title для ссылок если он предлагает больше информации чем текст ссылки. Даже в этом случае, текст атрибута title не должен быть обязательным, т.к. он может быть доступен не всем пользователям.

Не используйте атрибут title для важной информации

Атрибут title используется для предоставления дополнительной информации об HTML элементе, например ссылке. Если информация не только повторение текста ссылки то атрибут может быть полезен.

Вы не должны использовать атрибут  title для важной информации которая не доступна где-либо ещё. Причина в том что некоторые пользователи могут не знать о том что этот атрибут задан:

• Когда вы использует клавиатуру для навигации, большинство браузеров не показывает текст title (я не знаю о тех кто показывает)
• Большинство экранных читалок настроены не отображать title пока пользователь специально не попросит
• Есть задержка отображения title для людей которые пользуются мышкой и графическим браузером, поэтому они могут незаметить её пока не будут знать что он там есть

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

Написание хорошего альтернативного текста (атрибут alt)

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

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

Два главных правила которые я использую для описания альтернативного текста для изображений следующие:

• Если вам нужно описать документ кому-то по телефону упомяните ли вы картинку или её содержание? Если да, картинка вероятно нуждается в альтернативном тексте. Если нет, ей лучше иметь пустой атрибут alt.
• Будет ли альтернативный текст какой-нибудь картинки иметь значение если вы выключите показ картинок в браузере? Если нет, поправьте альтернативный текст так чтобы он имел значение и не предоставлял лишнюю информацию.

Это основные правила, и есть исключения, но я заметил что основном они прекрасно работают.

На практике это значит что изображения должны в основном иметь пустой альтернативный текст, alt="". Знайте также, что если картинка находится внутри ссылки которая не содержит также описывающего текста, картинке нужен альтернативный текст описывающий ссылку.

Намного более детальные советы по написанию альтернативного текста в статье на WebAIM - Подходящее использование альтернативного текста.

Материалом для заметки послужил перевод нескольких статей с 456bereastreet.com