Атрибут tabindex тега <address>

Описание

Атрибут tabindex определяет порядок перехода между элементами при навигации с помощью клавиши Tab. Для тега <address> этот атрибут может быть полезен, если элемент должен быть интерактивным.

Адрес с возможностью фокусировки:
<address tabindex="0"> Нажмите Tab чтобы сфокусироваться<br> ул. Фокусная, 10<br> Москва, Россия </address>
Кастомный порядок навигации:
<address tabindex="3">Адрес 1 (третий в порядке)</address> <address tabindex="1">Адрес 2 (первый в порядке)</address> <address tabindex="2">Адрес 3 (второй в порядке)</address>
Исключение из навигации:
<address tabindex="-1"> Этот адрес нельзя выделить через Tab<br> ул. Недоступная, 5 </address>

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

Характеристика Поведение
Значения
  • 0 - включается в естественную последовательность
  • -1 - исключается из последовательности, но доступен для фокуса через JS
  • Положительное число - задает кастомный порядок (не рекомендуется)
Наследование Не наследуется дочерними элементами
Доступность Влияет на accessibility tree и поведение скринридеров
Фокусируемость Делает элемент фокусируемым, даже если это не интерактивный элемент по умолчанию
Порядок навигации Элементы с tabindex="0" идут после элементов с положительным tabindex
Браузерная поддержка Полная поддержка во всех современных браузерах

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

  • Используйте tabindex="0" для добавления адреса в естественный поток навигации
  • Применяйте tabindex="-1" для временного исключения из навигации
  • Избегайте положительных значений - они нарушают логический порядок навигации
  • Сочетайте с JavaScript-обработчиками для интерактивных адресов
  • Для интерактивных элементов добавляйте визуальные стили состояния :focus
  • Тестируйте порядок навигации с клавиатуры
  • Учитывайте при создании модальных окон и других сложных интерактивных компонентов

Атрибут tabindex позволяет контролировать доступность элемента <address> для пользователей, которые полагаются на клавиатурную навигацию. При правильном использовании он значительно улучшает доступность веб-страниц.