Атрибут title тега <abbr>

Описание

Атрибут title в теге <abbr> используется для указания полного значения сокращения или аббревиатуры. При наведении курсора на элемент появляется всплывающая подсказка с расшифровкой.

Базовое использование:
<abbr title="HyperText Markup Language">HTML</abbr>

Особенности работы:

Платформа Поведение
Десктопные браузеры Подсказка появляется при наведении
Мобильные устройства Подсказка может не отображаться
Скринридеры Озвучивают содержимое title
Примеры различных сокращений:
<abbr title="World Wide Web">WWW</abbr> <abbr title="JavaScript">JS</abbr> <abbr title="Cascading Style Sheets">CSS</abbr> <abbr title="Соединённые Штаты Америки">США</abbr>

Рекомендации по использованию:

  • Всегда указывайте полное значение сокращения
  • Для сложных аббревиатур можно добавить пояснение
  • Используйте вместе с атрибутом lang для мультиязычных сайтов
  • Избегайте избыточных сокращений без реальной необходимости
  • Проверяйте отображение подсказки на разных устройствах
Комплексный пример:
<p> <abbr title="Representational State Transfer" lang="en">REST</abbr> - архитектурный стиль взаимодействия компонентов распределённого приложения. </p> <p> Основные технологии: <abbr title="HyperText Markup Language">HTML</abbr>, <abbr title="Cascading Style Sheets">CSS</abbr> и <abbr title="JavaScript">JS</abbr>. </p>

Доступность:

  • Скринридеры зачитывают содержимое атрибута title
  • Рекомендуется дублировать расшифровку в тексте при первом упоминании
  • Для важной информации не полагайтесь только на title
  • Можно использовать <dfn> для терминов при первом определении

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