Modal

Modals use proper ARIA attributes to communicate structure and state.

Modals use the appropriate ARIA dialog role.

The modal container uses role="dialog" to identify it as a dialog, and the heading is associated using aria-labelledby.

Modals are properly labeled for screen readers.

The heading serves as the accessible name for the modal, announced by screen readers when the modal opens.

Additional content can be described using aria-describedby.

Screen readers announce both the heading and the description when the modal opens.