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

Описание

Атрибут title добавляет всплывающую подсказку к элементу <var>, которая появляется при наведении курсора. Это полезно для предоставления дополнительной информации о переменной или математическом выражении.

Пример использования:
<p>Формула: <var title="Сумма квадратов">a² + b²</var> = <var title="Квадрат гипотенузы">c²</var></p>

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

  • Подсказка появляется при наведении курсора
  • Исчезает через несколько секунд или при уходе курсора
  • Поддерживает многострочный текст (с помощью \n)
  • Отображается стандартными средствами браузера

Рекомендуемые варианты использования:

Тип информации Пример Когда применять
Описание переменной "Радиус окружности" Для пояснения обозначений
Единицы измерения "В метрах (m)" Для физических величин
Диапазон значений "От 0 до 100" Для ограниченных переменных
Формула целиком "E = mc²" Для сокращённых обозначений

Пример с многострочной подсказкой:

<p> <var title="Скорость света\n299 792 458 м/с">c</var> в уравнении E=mc² </p>

Рекомендации:

  • Делайте подсказки краткими и информативными
  • Избегайте дублирования видимого текста
  • Для важной информации используйте видимые элементы
  • Комбинируйте с семантическими атрибутами

Ограничения:

  • Недоступен на мобильных устройствах (нет hover)
  • Не может быть стилизован средствами CSS
  • Некоторые скринридеры могут игнорировать
  • Не подходит для критически важной информации

Пример доступной реализации:

<p> Площадь круга: <var title="Формула: πr²" aria-label="Площадь равна пи эр квадрат">S</var> </p>
Важно: Не используйте атрибут title как замену:
  • Доступных текстовых описаний
  • Полноценных пояснений в основном тексте
  • SEO-оптимизированного контента
  • Обязательной информации

SEO комментарий:

Атрибут title имеет ограниченное влияние на SEO. Поисковые системы могут учитывать его содержимое, но не стоит использовать его для ключевых слов - это может быть расценено как спам.