Атрибут accesskey тега <textarea>
Описание
Атрибут accesskey в теге <textarea> позволяет задать комбинацию клавиш для быстрого доступа к текстовому полю. Это улучшает доступность и удобство работы с формой для пользователей, предпочитающих клавиатурный ввод.
<textarea accesskey="c">
Нажмите Alt+C (Windows) или Control+Option+C (Mac) для быстрого доступа
</textarea>
Особенности работы:
- Комбинация клавиш зависит от ОС и браузера
- Windows/Linux: Alt + ключ
- Mac: Control + Option + ключ
- Может конфликтовать с системными сочетаниями клавиш
- Поддерживается всеми современными браузерами
Рекомендации:
- Используйте разумные, запоминающиеся клавиши
- Избегайте конфликтов с популярными сочетаниями
- Документируйте горячие клавиши для пользователей
- Сочетайте с визуальными подсказками
Пример с визуальной подсказкой:
<label for="comment">
Комментарий <span class="accesskey-hint">(Alt+C)</span>
</label>
<textarea id="comment" accesskey="c"></textarea>
<style>
.accesskey-hint {
font-size: 0.8em;
color: #666;
}
</style>
Ограничения:
- Разные комбинации для разных платформ
- Ограниченное количество доступных клавиш
- Плохая поддержка в мобильных браузерах
- Может мешать работе скринридеров
Пример хорошей практики:
<div class="accessible-field">
<label for="feedback">
Обратная связь
<span class="sr-only"> (нажмите Alt+F для быстрого доступа)</span>
</label>
<textarea id="feedback" accesskey="f"></textarea>
</div>
<style>
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
</style>
Примечание: Для улучшения доступности:
- Используйте логичную систему accesskey на всем сайте
- Избегайте переопределения системных сочетаний
- Рассмотрите альтернативные методы навигации
- Тестируйте с реальными пользователями