Атрибут title тега <ul>
Описание
Атрибут title добавляет всплывающую подсказку (tooltip) к элементу <ul>, которая появляется при наведении курсора. Подсказка может содержать дополнительное описание списка.
<ul title="Список основных категорий товаров">
<li>Электроника</li>
<li>Одежда</li>
<li>Книги</li>
</ul>
Особенности работы:
- Подсказка появляется при наведении курсора
- Исчезает через несколько секунд или при уходе курсора
- Поддерживает многострочный текст (через \n)
- Отображается стандартными средствами браузера
Практические применения:
| Использование | Пример |
|---|---|
| Пояснение назначения списка | "Список последних заказов" |
| Дополнительная информация | "Обновлено: 15.06.2023" |
| Инструкции | "Выберите не более 3 пунктов" |
Пример с многострочной подсказкой:
<ul title="Список регионов\n(выберите один или несколько)">
<li>Центральный</li>
<li>Северо-Западный</li>
<li>Дальневосточный</li>
</ul>
Рекомендации:
- Делайте подсказки краткими и информативными
- Избегайте дублирования видимого текста
- Для важной информации используйте видимые элементы
- Комбинируйте с другими атрибутами (например,
aria-label)
Ограничения:
- Не доступен на мобильных устройствах (нет hover)
- Не может быть стилизован стандартными средствами CSS
- Некоторые скринридеры могут не озвучивать содержимое
- Не подходит для важной информации
Пример доступной реализации:
<div class="list-container">
<span class="visually-hidden">Список основных категорий товаров</span>
<ul title="Список основных категорий товаров" aria-labelledby="list-title">
<li>Электроника</li>
<li>Одежда</li>
</ul>
</div>
Важно: Не используйте атрибут
title как замену:
- Видимых заголовков списков
- Обязательных инструкций
- Доступных текстовых описаний
- SEO-оптимизированного контента
SEO комментарий:
Атрибут title имеет ограниченное влияние на SEO. Поисковые системы могут учитывать его содержимое, но не стоит использовать его для ключевых слов - это может быть расценено как спам.