Кратко
СкопированоСамостоятельная роль виджета из WAI-ARIA для «настоящего» меню, в котором элементы всегда видны и расположены горизонтально. Ещё его называют строкой меню. Такое меню встретите в операционных системах и программах.
В HTML нет тега с этой ролью.
Как пишется
СкопированоЗадайте role
любому тегу, лучше <div>
, <span>
или <ul>
.
Внутри контейнера с этой ролью должен быть минимум один пункт списка с menuitem
, menuitemcheckbox
или menuitemradio
.
Не забудьте о навигации с клавиатуры по пунктам меню и поработайте над порядком фокуса. С этим помогут JavaScript и глобальный атрибут tabindex
.
У роли menubar
есть встроенное свойство aria
.
Для строки меню можно использовать все глобальные ARIA-атрибуты, ещё один атрибут виджета aria
и атрибут связи aria
.
Как это понять
СкопированоМеню на сайтах обычно состоит из ссылок и для него достаточно использовать <ul>
, вложенный в <nav>
.
В классической, «настоящей» строке меню, как в компьютерной программе, обычно размещают часто используемые кнопки или другие элементы. Как раз для такого меню пригодится роль menubar
.