Semantic HTML Tags and Their Introduction
Semantic tags clearly describe the meaning of their content to both browsers and developers. Instead of just telling the browser how something looks, they convey the role or purpose of the content. Many were introduced in HTML5 (2014 W3C Recommendation), while a few existed earlier.
<mark> (HTML5) – Highlights or marks text for reference.
<time> (HTML5) – Represents dates and times in a machine-readable way.
<abbr> (HTML4) – Defines abbreviations/acronyms.
<cite> (HTML4) – Reference to a creative work (book, article, etc.).
<code> (HTML4) – Represents inline code snippets.
<em> (HTML4) – Emphasized text, usually italicized.
<strong> (HTML4) – Important text, usually bold.
<q> (HTML4) – Short inline quotation.
<label> (HTML4) – Semantic association with form controls.
<bdi> (HTML5) – Bi-directional text isolation.
<wbr> (HTML5) – Word break opportunity for better text rendering.
Most of the modern layout-related semantic tags like <header>, <footer>, <article>, <aside>, <nav>, <main>, <figure>, and <figcaption> were introduced with HTML5 (2014). Older semantics like <em>, <strong>, <cite>, <code>, <blockquote>, etc., have existed since HTML4 (1997).
0-2 years experience
2-5 years experience
5-8 years experience
8+ years experience
