Difference between Semantic and Non-Semantic elements in HTML

author details
AdiPie
4th Aug 2021
2 mins read
Image
semantic_tag

A semantic component unmistakably depicts its significance to both the program and the engineer.

Examples of HTML Non-Semantic elements: <div> and <span> Enlightens nothing regarding content.

Examples of HTML Semantic elements: <form><table>, and <article> Clearly explain its content.

Semantic Elements In HTML

Almost many website container having html tags like <div id="header"> </div> <div id="section"> </div> <div id="footer"> </div> to define header, section and footer.

In HTML there are some semantic components that can be utilized to characterize various pieces of a website page:

<article>
<aside>
<details>
<figcaption>
<figure>
<footer>
<header>
<main>
<mark>
<nav>
<section>
<summary>
<time>

Non Semantic Elements In HTML

Some of the html tags does not tell about the content.

Below are some of the semantic component:

<div>
<span>