Tag Archives: WAI ARIA

aria-rowspan property

aria-rowspan property defines the number of rows a cell spanned within a table, grid or a treegrid. Use host attribute equivalent if available. If both the host language equivalent and aria-rowspan property are defined user agents have to pick the value expressed through the host language attribute and expose it to assistive technologies. Content authors… Continue Reading aria-rowspan property

aria-placeholder (property)

Aria-placeholder property is new in ARIA 1.1 specifications. This property is used to provide a short hint for text input fields when it does not have any text. In other words the string supplied through aria-placeholder should be available whenever the value property of the text field is empty. The hint provided through this property… Continue Reading aria-placeholder (property)

aria-modal (property)

aria-modal is a new property introduced in ARIA 1.1. It indicates if an element is a modal when displayed. Modal window ¬†or simply modal is used only in specific situations where the entire work flow is blocked until the content in the overlay window gets attention. These are typically used to grab complete user attention… Continue Reading aria-modal (property)

aria-current (State)

aria-current state is used to indicate the current item in a set of elements within a component or a widget or a set of related elements. The aria-current state is specifically important to inform the screen reader user about the difference when an element within a set of related elements is visually styled to indicate… Continue Reading aria-current (State)

aria-selected (state)

Aria-selected state is used to notify when one or more items in a widget have selectable functionality. Eg: various tabs in a tab panel have selectable mechanism. In general the selected state is notified to the user with a change in color. The change in color notification will not be recognized by screen reading technologies.… Continue Reading aria-selected (state)

aria-required (property)

aria-required property is used on a form element when the user input is required on the field. Providing aria-required property set to true before the form submission avoid users from making mistakes. Aria-required property like any other aria role, state or property just indicates that the field is required to the user. The visual identification… Continue Reading aria-required (property)

aria-relevant (property)

Aria-relevant property is an optional value to an aria-live region. Aria-relevant property is used when the web page contains frequently updating content such as a live chat. Aria-relevant property helps in intimating the updated content to the assistive technology. In some cases it is also important for the user to intimate the logs that are… Continue Reading aria-relevant (property)

aria-readonly (property)

aria-readonly (property) is used when certain fields on the page are not editable. User can just find information on the readonly field but cannot edit. By setting aria-readonly property to true screen reader user can identify that the field is readonly. When aria-readonly (property) is used on any element content authors should allow focusing on… Continue Reading aria-readonly (property)

aria-pressed (state)

aria-pressed state is used to inform the user that an element is a toggle button. aria-checked(state) and aria-selected (state) (future link) are similar to aria-pressed. In normal state aria-pressed will be in release state and the value is false. When the user clicks or activates the button it changes to pressed state where the value… Continue Reading aria-pressed (state)

aria-posinset (property)

Aria-posinset property defines an element’s number or position in the current set of listitems or treeitems. Defining aria-posinset is not required if all elements in the set are present in the DOM. If all items in a set are present in the document structure, it is not necessary to set aria-posinset attribute, as the user… Continue Reading aria-posinset (property)