Category Archives: WAI-ARIA

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-valuetext property

Aria-valuetext property works similar to a aria-valuenow property. It Defines the human readable text alternative of aria-valuenow for a range widget. If aria-valuetext property is defined for any widget, author should also specify aria-valuenow unless aria-valuenow cannot be determined. The major difference between aria-valuetext and aria-value now is the type of value determined through them.… Continue Reading aria-valuetext property

aria-valuenow property

aria-valuenow property is used while developing range widgets. For a range widget a minimum and maximum values need to be defined. Examples of a range widget are sliders such as volume button on windows operating system. The volume button has a minimum value of 0% to a maximum value of 100%. Other range widgets include… Continue Reading aria-valuenow property

aria-valuemin (property)

aria-valuemin property is used while developing range widgets. For a range widget a minimum and maximum values need to be defined. Examples of a range widget are sliders such as volume button on windows operating system. The volume button has a minimum value of 0% to a maximum value of 100%. Other range widgets include… Continue Reading aria-valuemin (property)

aria-valuemax (property)

aria-valuemax property is used while developing range widgets. For a range widget a minimum and maximum values need to be defined. Examples of a range widget are sliders such as volume button on windows operating system. The volume button has a minimum value of 0% to a maximum value of 100%. Other range widgets include… Continue Reading aria-valuemax (property)

aria-sort (property)

aria-sort (property) is used to inform the screen reader user whether the columns or rows in a grid can be sorted. Aria-sort (property) is used to a table header or a grid header. This aria-sort (property) can be used both for column headers or row headers. aria-sort (property) has two possible values “ascending” and “descending”.… Continue Reading aria-sort (property)

aria-setsize (property)

aria-setsize property defines total number of items in a list or a treeview. Defining aria-setsize 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-setsize attribute, as the user agent can automatically… Continue Reading aria-setsize (property)

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)