Semantic Elements

Semantic Elements are those elements they describes their meanings.

What are Semantic Elements?

A semantic element plainly specify its meaning to the web browser and the web developer. 

Examples of non-semantic elements: 

<span> and <div> 

• Those tags nothing defines about its content. 

Examples of semantic elements: 

<header>, <nav>, <footer>, <article>,<time>, <form>, <table>, and <section> 

• Plainly describes its content.

Semantic Elements in HTML5

The new version of Hypertext Markup Language deliver us several new elements for documents and applications, Permissive us to enhance the current effectiveness of HTML.

<article> Specify an article 

<aside> Specify content aside from the page content 

<address> Specify the contact information

<details> Specify further details that the user can view or hide 

<figcaption> Specify a caption for a <figure> element 

<figure> Specify self-contained content, like illustrations, diagrams, photos, code listings, etc. <footer> Specify a footer for a document or section 

<header> Specify a header for a document or section 

<main> Specifies the main content of a document 

<mark> Specify marked/highlighted text 

<nav> Specify navigation links 

<section> Specify  a section in a document 

<time> Specify a date/time

The purpose of HTML tags is to convey explanation to a document. Do not be bothered about how view your webpage. Target on the message of each tag you’ll benefit. Depending on the content you’re writing, you can choose the relevant element that meet the meaning of your text. Fine code is more easily maintained. It also means that a different developer could join and work with the code without distraction.

BUILD A MORE MEANINGFUL WEBSITE 

Basically, following semantic elements for website and using exactly structured and validated code is your best strategy for providing that your web content will be helpful and clear into the future.