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:
- 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:
- Attribute
aria-labelledby
is defined AND is not empty. - Attribute
aria-label
is defined AND is not empty. - Attribute
title
is defined AND is not empty.
Standard
Accessibility, Best Practices, SiteLint