Semantic HTML: The Key tags and their functions.

The moment i came across HTML 5 i felt so glad, it has introduced a whole set of new elements that make it much easier to structure pages.

What is Semantics?

semantics gives content on the page meaning, structure, value and not just its style. The use of Semantic HTML has helped search Engines classify and categorize contents, easier site maintenance for developers, restyling and updates.

Let’s talk about the Semantic HTML elements, their key tags and functions.

• 
  The header element represents introductory content for its sectioning root element. A header can nest a group of introductory or navigational aids and it be several times on a content page.

• 
  The section element represents a generic section of a document or application. It is a thematic grouping of content.A website Home page could be into section such as introduction, content and contact This element can nest h1and p tag as a child of the section element.

• 
  element represents the article in a content, its a standalone element(independent). This element is used for blog, forum posts and newspaper articles.

• 
  specifies the main content of a document. The content inside the

  element shouldn’t have repeated contents across a document such as navigation links, copyright information, sidebars, site logos, and search forms. Only one

  element in a document can be used.The

  element must NOT be a descendant every other elements as

• 
  specifies additional details that the user can view or hide on demand. The element creates an interactive widget a user can open and close. Different sort of content can be put inside the

  . content can only be visible when the open attribute is set.

• 
  tag defines a visible heading for the

  element. The heading can be clicked to view/hide the details.

• 
  element is used when you want to highlight parts of your text.

• 
  element is used to encode dates and times in a machine-readable way so users can add scheduled Events to the user’s calendar, and search engines can produce smarter search results. This is a human-readable date/time.