Detailed answer
Use it when an element needs an accessible name not supplied adequately by visible content.
A clear visible label is usually preferable. Aria-label can override text-derived naming, so keep the name consistent with what users see. It is not a general tooltip or a replacement for thoughtful interface wording.
Example
<button type="button" aria-label="Close preview">×</button>
Understanding the behavior
Aria-label can provide an accessible name when an appropriate visible label is unavailable, such as for an icon-only control. Prefer visible, understandable labels when practical. Naming a non-interactive element does not give it keyboard behavior or control semantics.
Practical implementation notes
Inspect the computed accessible name and compare it with any visible wording. An aria-label can override other naming sources, so careless use can make a control's spoken name differ from what sighted users see.
How to check it
Inspect the control's computed accessible name after adding concise naming.
Expected result
It is announced as Close preview rather than an unexplained symbol.
Watch out: Avoid hidden wording that contradicts a visible control label.
Read the reference ↗