When an element gets focus, screen readers
ask the browser for the element's name (aka label) so that it can be spoken
aloud or rendered on a Braille display.
You can specify an element's name in
1) If the element has innerHTML and
if it's a type of element that can use content as its name, i.e. <button>Name</button>,
then give it a good name and you're done.
2) If there's a visible element that
can be used as a label, then use the aria-labelledby attribute to use the
text from the other element for the name (you can actually concatenate
text from multiple elements).
3) If there's no visible element to
use as a label, you can provide a name string with aria-label.
4) Provide <label> for <input>
5) Provide alt text if the element is
an <img> or other object that supports alt.
6) Optionally provide a title.