role Attribute
The role attribute comes from the WAI-ARIA specification and assigns an HTML element a semantic role that assistive technologies such as screen readers can recognise – particularly important for non-semantic elements like div or span.
In practice
Wherever possible, prefer a native HTML element. A real
<button> is always the more robust choice over <div role="button">, because keyboard operability and states such as "pressed" come with it automatically. If a role is assigned through the role attribute anyway, keyboard operability, focus handling and key events have to be rebuilt manually. Whether the result really works only becomes clear in a test with a real screen reader.