Атрибут title тега <form>
Описание
Атрибут title добавляет всплывающую подсказку (tooltip) к элементу <form>, которая появляется при наведении курсора на форму. Подсказка может содержать дополнительную информацию о назначении формы.
<form action="/submit" method="post"
title="Заполните все обязательные поля (помечены *)">
<!-- Поля формы -->
</form>
Особенности работы:
| Параметр | Описание |
|---|---|
| Отображение | Появляется при наведении (задержка ~1 сек) |
| Содержимое | Только текст (без HTML-разметки) |
| Доступность | Читается скринридерами |
Рекомендации по использованию:
- Используйте для пояснения сложных форм
- Добавляйте подсказки о формате данных
- Указывайте обязательные требования
- Делайте текст кратким (1-2 предложения)
Примеры хороших подсказок:
<!-- Форма регистрации -->
<form title="Пароль должен содержать минимум 8 символов"></form>
<!-- Форма поиска -->
<form title="Можно использовать * для поиска по части слова"></form>
<!-- Контактная форма -->
<form title="Ответим в течение 24 часов в рабочие дни"></form>
Особенности доступности:
- Подсказка читается программами экранного доступа
- Не заменяет текстовые пояснения для полей формы
- Не должен содержать критически важную информацию
- Дублируйте важные сведения в видимом тексте
Ограничения:
- Не работает на мобильных устройствах при обычном касании
- Внешний вид зависит от браузера и ОС
- Не поддерживает сложное форматирование
- Может конфликтовать с кастомными тултипами
Альтернативы для лучшего UX:
<form>
<div class="form-hint">
Пароль должен содержать минимум 8 символов
</div>
<!-- Поля формы -->
</form>
<style>
.form-hint {
padding: 10px;
background: #f5f5f5;
margin-bottom: 15px;
}
</style>
Примечание: Хотя атрибут title полезен для быстрых подсказок, в современных интерфейсах лучше использовать видимые текстовые пояснения или специализированные компоненты тултипов, которые работают на всех устройствах и предоставляют больше возможностей для оформления.