Клавиша / esc

progressbar

Роль для прогресс-бара, индикатора выполнения задачи.

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

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

Кратко

Скопировано

Самостоятельная роль виджета из WAI-ARIA для индикатор выполнения задачи — прогресс-бара.

В HTML эта роль есть у <progress> по умолчанию.

Как пишется

Скопировано

Задайте role="progressbar" любому тегу, но лучше всего <div> или <span>. В большинстве случаев лучше использовать <progress>.

У progressbar должны быть атрибуты aria-valuemin для минимального значения, aria-valuemax для максимального и aria-valuenow для текущего. По умолчанию роли заданы aria-valuemin="0" и aria-valuemax="100". Значение aria-valuenow не должно быть выше максимального значения и ниже минимального.

Если прогресс выполнения задачи относится к определённой части страницы, свяжите прогресс-бар с ней при помощи aria-describedby и задайте этой части страницы aria-busy="true".

Элементам с ролью progressbar также можно задавать остальные глобальные ARIA-атрибуты.