2018-10-12 15:37:13 -04:00
|
|
|
---
|
|
|
|
|
title: Role Attribute
|
|
|
|
|
---
|
|
|
|
|
## Role Attribute
|
|
|
|
|
|
2019-01-18 03:09:21 +01:00
|
|
|
The `role` attribute describes the role of an element to programs that can make use of it, such as screen readers or magnifiers.
|
2018-10-12 15:37:13 -04:00
|
|
|
|
|
|
|
|
Usage Example:
|
|
|
|
|
```html
|
|
|
|
|
<a href="#" role="button">Button Link</a>
|
|
|
|
|
```
|
|
|
|
|
Screen Readers will read this element as "button" instead of "link".
|
|
|
|
|
|
|
|
|
|
There are four categories of roles:
|
|
|
|
|
- Abstract Roles
|
|
|
|
|
- Widget Roles
|
|
|
|
|
- Document Structure Roles
|
|
|
|
|
- Landmark Roles
|
|
|
|
|
|
2019-01-18 03:09:21 +01:00
|
|
|
For the full list of existing roles, refer to [aria roles documentation](https://www.w3.org/TR/wai-aria/roles).
|
