search

Как добавить ориентир для поиска по сайту с помощью WAI-ARIA.

Время чтения: меньше 5 мин

Это незавершённая статья. Вы можете помочь её закончить! Почитайте о том, как контрибьютить в Доку.

Кратко

Секция статьи "Кратко"

ARIA-роль ориентира, которая определяет область с поиском по сайту. В этой области может находиться не только поисковая строка, но фильтры или ссылки, которые связаны с поиском.

В HTML нет аналога для этой роли.

Пример

Секция статьи "Пример"
        
          
          <form role="search">  <label for="search-field">Поиск по сайту</label>  <input type="search" id="search-field" name="search">  <input type="submit" value="Submit"></form>
          <form role="search">
  <label for="search-field">Поиск по сайту</label>
  <input type="search" id="search-field" name="search">
  <input type="submit" value="Submit">
</form>

        
        
          
        
      

Как пишется

Секция статьи "Как пишется"

Добавьте к тегу role="search". Это может быть <div>, <span> или <form>, в который вложен <input type="search">.

Для элемента с ролью search можно использовать все глобальные ARIA-атрибуты.

Как понять

Секция статьи "Как понять"

Роль search создаёт ориентир на странице. Это значит, что пользователи скринридеров могут быстро переместиться к этой части страницы с помощью горячих клавиш или через меню с ориентирами.