What is the use of the ARIA role in html?

Question

I saw the documentation for the ARIA role, but could not understand it. What exactly is he doing? Let's say I use it in a table as follows:

<td role='button'>text</td> 

Does this mean that this cell will act like a button? Can someone explain this in simpler terms?

Answer 1

You can reference the MDN , which says:

The button role should be used for interactive elements that trigger a response when activated by the user. By itself, the role = "button" can be made by any element (for example, <p>, <span> or <div> ) in the form of a button controlling the screen reader. You can also use this role in combination with an attribute compressed with an aria to create a button switch.

Also see note

If possible, it is recommended to use your own HTML buttons ( <button>, <input type="button" /> and <input type="image" /> ), rather than the role of a button, since embedded HTML buttons are more widely supported by older user agents and assistive technology. Embedded HTML buttons also support keyboard and focus requirements by default, without the need for additional customization.

W3.org also has a detailed explanation of aria-role

Answer 2

As indicated, ARIA is intended for accessibility, and the role attribute will not affect regular browsers.

One of the easiest and most functional ways to implement the ARIA role is to use landmarks. Some ARIA roles are landmarks that allow users to navigate to specific parts of a page in on-screen programs. Some blind users find this useful, as it helps them move quickly. Support and behavior across different display devices is described here .