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" is having defined an 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.

    Techniques

    Not Applicable

    Was this article helpful to you? Yes No