ARIA-роли

Все роли организованы в иерархическую структуру. Каждая имеет свой суперкласс и свои подклассы (кроме крайних в иерархии). Ниже суперкласс для роли указан после пояснения, в скобках.

Всего различают четыре вида ролей.

Абстрактные роли (Abstract Roles)

Используются, чтобы поддержать ролевую таксономию WAI-АРИИ с целью определения общих ролевых понятий. При разработке реальных документов их использовать не следует — они введены для онтологии (полноты описания). Примеры абстрактных ролей:

- roletype — базовая роль, являющаяся родительской для остальных в этой таксономии;

- window — окно браузера или приложения (roletype);

- widget — интерактивный компонент графического интерфейса пользователя (GUI). Родительский элемент для практически всех элементов управления (roletype);

- structure — общий тип для основных структурных элементов (roletype);

- command — форма виджета, выполняющего действие, но не получающего входных данных (HTML5-аналог — тег <command>) (widget);

- composite — виджет, включающий в себя навигационные элементы и дочерний контент (widget);

- landmark — область страницы, используемая как навигационный ориентир (region);

- section — структурная единица в документе или приложении, объединяющая контент в секцию (structure);

- sectionhead — структура, маркирующая связанную с ней секцию (structure);

- input — общий тип для виджета, представляющего поля ввода (widget);

- select — общий тип для элемента; формы, позволяющие сделать выбор из списка (input);

- range — общий тип для элемента; формы, позволяющие сделать выбор из диапазона значений (input).

Роли — виджеты (Widget Roles)

Роли, выполняющие роль автономного пользовательского интерфейса, или автономной части, пользовательского интерфейса:

- alert — сообщения с критически важной информацией (region);

- button — соответствует кнопке в широком смысле слова, то есть объекту с двумя положениями, который при нажатии запускает какие-то действия, определенные пользователем;

- checkbox — элемент управления с тремя возможными состояниями — true, false или mixed (input);

- radio — элемент, соответствующий радиокнопке — может быть выбран только один из группы (checkbox);

- radiogroup — группа радиокнопок (select);

- dialog — окно приложения, которое разработано, чтобы прервать текущую обработку применения, чтобы побудить п оль-зователя входить в информацию или требовать ответа;

- grid — интерактивный контроль в виде таблицы;

- gridcell — ячейка таблицы или древовидной структуры;

- link — интерактивная ссылка на внутренний или внешний ресурс;

- log — регион, в котором новая информация добавляется в определенном порядке к старой (region);

- marquee — область контента с изменяющейся информацией;

- menu — тип виджета, предлагающий пользователю список пунктов для выбора;

- menubar — представление пунктов меню, обычно в виде горизонтальной полоски;

- menuitem — пункт меню;

- option — элемент выбора из списка;

- listbox — виджет, позволяющий пользователю выбирать один или несколько пунктов из списка выбора;

- progressbar — аналог HTML5-элемента <progress>;

- scrollbar — графический объект, который управляет прокруткой содержания в области видимости (range);

- combobox — виджет, позволяющий выбрать текстовый элемент из списка или ввести текст в поле ввода;

- textbox — поле для ввода текста;

- slider — элемент для ввода данных пользователем, где пользователь выбирает значение в пределах данного диапазона (частный случай — <input type= ”range”>);

- Status — контейнер, содержание которого — информация для пользователя, недостаточно важно для элемента alert, чаще всего это статусная строка();

- tab — гримирующий элемент в виде tab-вкладки (widget);

- tabpanel — панель, собирающая tab-элементы (region);

- timer — тип региона, содержащего числовой счетчик, указывающий количество времени, прошедшего от стартовой точки или оставшегося до конечной точки (status);

- tooltip — контекстное всплывающее окно, показывающее описание для элемента (section);

- tree — тип списка, содержащий древовидно (nested) организованные подуровни (select);

- treeitem — пункт выбора в древовидной структуре (listitem, option).

Роли структуры документа (Document Structure Roles)

- document — регион, отмеченный как веб-документ;

- article — секция страницы, имеющая самостоятельное автономное содержание (соответствует <article></article>);

- definition — секция c определением термина или понятия (section);

- directory — шисок ссылок на членов группы, таких как статическое оглавление (list);

- group — секция, объединяющая элементы, не сгруппированные другими средствами;

- heading — соответствует контейнеру <header></header> в HTML5;

- img — контейнер для коллекции элементов, формирующих изображение;

- list — группа записей, объединенных в список;

- listitem — единичный элемент списка или директории;

- math — контейнер для представления математических выражений (section). Пример для формата MathML:

<div role="math" aria-label="6 divided by 4 equals 1.5">

<math xmlns="Http://www. w3.org/1998/Math/MathML">

<mfrac>

<mn>6</mn>

<mn>4</mn>

</mfrac>

<mo>=</mo>

<mn>1.5</mn>

</math>

</div>

- region — область веб-страницы или документа, имеющая большое самостоятельное значение (section);

- row — ряд ячеек таблицы (group);

- toolbar — коллекция обычно используемых кнопок функции представлена в компактной визуальной форме;

- note — секция, содержание которой вводное или вспомогательное для основного содержания ресурса (section).

Роли разметки (Landmark Roles)

Области страницы, предназначенной как навигационные ориентиры:

- application — регион, отмеченный как веб-приложение (в отличие от веб-документа);

- banner — область, занимающая определенное место, без привязки к содержанию (собственно буквальное значение этого термина);

- complementary — секция документа, служащая дополнением к основному содержанию;

- contentinfo — большой заметный регион, содержащий информацию о родительском документе;

- form — регион, содержащий коллекцию элементов вода;

- main — основная часть документа;

- navigation — регион, содержащий коллекцию элементов навигации, соответствует HTML5-контейнеру <nav></nav>;

- search — регион, содержащий коллекцию элементов ввода для поиска. Частный случай — <input type= "search">.

Наверное, достаточно. Остальные роли можно найти в документации, да и их количество все время меняется.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *