nib
nib copied to clipboard
WAI ARIA Compliance
trafficstars
To comply with WIA-ARIA rules I plan to implement following:
- All clickable sections should be focuseable.
- Add following
roleattribute to tag as applicable: 1.button- An input that allows for user-triggered actions when clicked or pressed.aria-disabled,aria-label,aria-haspopup2.cell- A cell in a tabular container. 3.columnheader- A cell containing header information for a column. 3.dialog- A dialog is a descendant window of the primary window of a web application. For HTML pages, the primary application window is the entire web document, i.e., the body element.aria-label,Authors SHOULD focus an element in the modal dialog when it is displayed, and authors SHOULD manage focus of modal dialogs.,aria-modal4.heading- A heading for a section of the page.aria-level5.img- A container for a collection of elements that form an image.aria-label6.textbox- A generic type of widget that allows user input.aria-placeholder,aria-required,aria-label,aria-labelledby,aria-disabled, 7.link- An interactive reference to an internal or external resource that, when activated, causes the user agent to navigate to that resource.aria-disabled,aria-label8.list- A section containing listitem elements. See related listbox. 9.listitem- A single item in a list or directory. 10.option- A selectable item in a select list. 11.grid- A composite widget containing a collection of one or more rows with one or more cells where some or all cells in the grid are focusable by using methods of two-dimensional navigation, such as directional arrow keys.aria-label12.listbox- A widget that allows the user to select one or more items from a list of choices. 13.row- A row of cells in a tabular container. 14.rowheader- A cell containing header information for a row in a grid. 15.separator- A divider that separates and distinguishes sections of content or groups of menuitems. 16.table- A section containing data arranged in rows and columns. 18.toolbar- A collection of commonly used function buttons or controls represented in compact visual form.Authors MUST supply a label on each toolbar when the application contains more than one toolbar.19. tooltip - A contextual popup that displays a description for an element.Authors SHOULD ensure that elements with the role tooltip are referenced through the use of aria-describedby before or at the time the tooltip is displayed.
aria-readonly, aria-required, aria-label, aria-labelledby, aria-disabled, aria-hidden, aria-keyshortcuts
- Menu items should all be focuseable.
Ref: https://www.w3.org/TR/wai-aria-1.1/#introduction