Although the above discussion clearly mentions the importance of using meaning tags and prohibits the use of tags like you may still have to use them for styling purposes. As you read on, you will realize how semantic tags must be supplied for providing meaning to your tags.
It is important to mention here that semantic tags should be used carefully, and if you realize that there is a need to define custom elements, then go ahead and use the and elements. However, be sure to add an ID and class name to the elements that describe their meaning as well as possible.
How to Create HTML5 Layout Container
A layout container, as the name suggests, is a container that entails the layout of a page. In other words, the container contains the different sections of the layout or its children in such a manner that they can be positioned in a flexible manner.
As a developer, you can easily distinguish between elements on the basis of their class names and IDs. However, this is not true for browsers. Therefore, there has got to be a way by which you can ask the browser to interpret elements. For instance, you may want to ask the browser to focus on a certain element upon opening.
All this and more can be done with the help of layout containers that express elements in such a manner that they are understandable to both the browser and the user.
Some of the commonly used elements for creating a layout container include:
- It is used to define the header section or the topmost section of the . HTML Interview Questions. This element can also be defined inside the element.
- It is used to define the footer section or the bottom-most section of the HTML document. This element can also be defined inside the element.
- It is used to define the section that contains all the navigational links.
- This element is generally used for sidebars and separates the content in the element from the content that is outside this element.
- This element defines a part of the whole section and is named with the elements
- This element defines a complete unit of content, which you can copy from one
location to another. An example of such a unit is a blog post.
Using Roles
The role attribute can be declared inside the and elements. The role class hierarchy and the usage of roles for providing specific meanings, as far as accessibility is concerned, is defined in WAI-ARIA (Web Accessible Initiative – Accessible Rich Internet Applications). One of the parent role classes is the landmark role class, which defines the navigational landmarks on the webpage.
