ProgressBar Accessibility

Accesibility Attributes

Web accessibility makes web content and web applications more accessible to disabled people. It's especially helpful in dynamic content changes and development of advanced user interface components with HTML, Javascript and related technologies. Smart HTML elements framework offers full accessibility support for it's web components.

ProgressBar provides a built-in compliance with WAI-ARIA specification. This is achieved through attributes like role, aria-valuenow, aria-valuemin, aria-valuemax and others.

The purpose of the ARIA attributes is to help disabled people by providing the information specific to the component to assistive technology in the screen readers.

The Progress bar component is a standard accessibility control with a role "progressbar". It displays the progress status for tasks that take a long time. A progress bar indicates that the user's request has been received and the application is making progress toward completing the requested action.

The following ARIA attributes are used by the ProgressBar component:

  • aria-disabled - indicates that the interaction with the ProgressBar component is disabled.
  • aria-labelledby - applied to the Progress bar component, this attribute points to the id of the element that labels it. There's a specific container that holds the label of the progress bar which appears inside it.
  • aria-valuemax - indicates the maximum of the progress bar.
  • aria-valuemin - indicates the minimum of the progress bar.
  • aria-valuenow - indicates the current value of the progress bar.

Additional information on WAI-ARIA for the SMART Framework can be found here.