SiteLint

  1. Home
  2. Docs
  3. SiteLint
  4. Accessibility Rules
  5. aria-role-dialog

aria-role-dialog

Print this article

Description

Ensures that element with attribute role="dialog" has a defined accessible name.

Context

Using role="dialog" on the HTML element helps assistive technology identify the dialog’s content as being grouped and separated from the rest of the page content. However, having only role="dialog" defined alone is not sufficient to make a dialog accessible. Additionally, the following needs to be done:

  1. The dialog must be properly labeled
  2. Keyboard focus must be managed correctly

Note: when possible you may consider using native <dialog> box feature.

How to fix it

The rule passes when one of the following cases is fulfilled:

  1. Attribute aria-labelledby is defined AND is not empty.
  2. Attribute aria-label is defined AND is not empty.
  3. Attribute title is defined AND is not empty.

Standard

Accessibility, Best Practices, SiteLint

Was this article helpful to you? Yes No