ARIA Dialog and Alertdialog Must Have an Accessible Name
- December 7, 2025
- Accessibility, Dialogs
Quick Reference
Element Code: AC-023
Issue: Modal dialogs lack accessible names
Impact: Screen readers cannot announce what the dialog is about
Fix: Add aria-label or aria-labelledby to dialog elements
Detection: axe DevTools, screen reader testing
What Is This Issue?
Modal dialogs (role="dialog" or role="alertdialog") need accessible names so screen readers can announce them when they open. Without a name, users may not understand the dialog purpose.
Why This Matters for Your Website
Modals are common UI patterns for forms, confirmations, and alerts. Unlabeled dialogs create confusion and can prevent task completion.
How to Fix This Issue
- Use aria-labelledby: Reference the dialog heading
- Or aria-label: If no visible heading exists
- Manage focus: Move focus into dialog when opened
Tools for Detection
- axe DevTools: Flags unlabeled dialogs
TL;DR (The Simple Version)
Your modal dialogs have no names. Use aria-labelledby to connect the dialog to its heading, or add aria-label if there is no visible title.
About SEO ProCheck
Technical SEO consulting and GEO strategy with 20 years of enterprise experience. Case studies, resources, and tools for search and AI visibility.
Work With Me
Technical SEO audits, GEO strategy, site migrations, and international SEO. Hourly consulting for teams who need hands-on support, not just reports.
Subscribe to our newsletter!
Recent Posts
- No Social Schema December 7, 2025
- Missing Social Profile Links December 7, 2025
- Social Image Wrong Size December 7, 2025