Ensures that element with attribute
role="dialog" has a defined accessible name.
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:
- The dialog must be properly labeled
- 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:
aria-labelledbyis defined AND is not empty.
aria-labelis defined AND is not empty.
titleis defined AND is not empty.
Accessibility, Best Practices, SiteLint