list

Роль структуры документа из WAI-ARIA. Добавляет любому тегу семантическую роль списка. Делает содержимое более доступным для скринридеров, если нет возможности использовать возможности HTML.

Роль есть у тегов <ul> и <ol> по умолчанию.

        
          
          <section role="list">  <div role="listitem">Элемент списка 1</div>  <div role="listitem">Элемент списка 2</div>  <div role="listitem">Элемент списка 3</div></section>
          <section role="list">
  <div role="listitem">Элемент списка 1</div>
  <div role="listitem">Элемент списка 2</div>
  <div role="listitem">Элемент списка 3</div>
</section>

        
        
          
            
            Скопировать
            Скопировано
            Не удалось скопировать
          
        
      

Добавьте к тегу ARIA-атрибут role со значением 'list'.

Внутри контейнера с этой ролью должен быть хотя бы один элемент с ролью listitem. Также в элемент с ролью list можно добавить один или несколько вложенных списков с ролью group. Во вложенных списках также должен быть минимум один элемент с listitem.

Чаще всего для списков используют теги <ul> или <ol>. Если по какой-то причине не можете их использовать, тогда задавайте элементам явные роли list и listitem. Это могут быть кастомный элемент или поддержка старого кода.

Не дублируйте role="list" для тегов <ul> и <ol>, в них уже встроена эта роль по умолчанию.

Обратите внимание, list не означает конкретный вид списка — упорядоченный или неупорядоченный. Так как list не изменяет внешний вид элементов, не забудьте стилизовать элементы с ней с помощью CSS.

Роль list изменяет семантику других HTML-тегов на семантику списка.