- Roles: define what an element is or does.
- role=" dialog" to set a dialog for modal.
- role=" content" set the entire content for the dialog.
- Properties: it’s used to give them extra meaning or semantics.
- aria-label: to describe label for non-text content (close icon).
- aria-describedby: to describe the content for the dialog.
- aria-live: to announce the active region.
- States: define the current conditions of elements.
- aria-hidden: to indicates that the element and all of its descendants are not visible or perceivable.