Dialog title is missing an accessible name
Description
Rule ID: aria-role-dialog
.
Ensures that an 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.
SEO impact
Based on our experience, the role="dialog"
attribute is not directly related to SEO (Search Engine Optimization). Google and Bing’s search bot, for example, does not prioritize or penalize websites based on the use of <dialog>
or <div>
HTML elements for dialogs. Google and Bing primarily focus on elements like titles, meta tags, and structured data for SEO purposes.
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