Skip to content
Related Articles
Get the best out of our app
GeeksforGeeks App
Open App
geeksforgeeks
Browser
Continue

Related Articles

What is the purpose of “role” attribute in HTML ?

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

The main purpose of role attribute is to bolster ARIA i.e. Accessible Rich Internet Applications which helps in providing richness and quality from semantic perspective. Moreover, role attribute makes a website more facilitative and using this attribute is considered as a good practice. Generally, the role is necessary for languages which do not define their own role attribute.

Example:




<!DOCTYPE>
<html lang="en">
  
<head>
    <meta charset="utf-8">
    <title>
        Output of Role Attribute
    </title>
    <style>
        h1 {
            text-align: center;
            color: green;
            font-size: 100px;
        }
          
        h2 {
            text-align: center;
        }
    </style>
</head>
  
<body role="document">
    <h1>GeeksforGeeks</h1>
    <h2>Understanding usage of "Role" Attribute</h2>
</body>
  
</html>

Output:

Role Attribute Output

Output obtained for role attribute

The output doesn’t show any significant thing to notice. This shows that even if the role attribute is not used in the code, then also it won’t affect our code and output.

By using role attributes, we get to avail features like accessibility, device adaptation, server-side processing, complex data description, and many more such features. Thus role attribute is advised to be used for getting better performance of the code.

My Personal Notes arrow_drop_up
Last Updated : 18 Nov, 2019
Like Article
Save Article
Similar Reads
Related Tutorials