HTML Semantics Elements
HTML semantic elements are HTML tags that provide meaning and context to the content within them.
Semantic elements help search engines, screen readers, and other devices better understand the structure and content of a web page.
Here are some examples of HTML semantic elements:
<header>: Used to define a header section of a web page.<nav>: Used to define a navigation section of a web page.<main>: Used to define the main content of a web page.<article>: Used to define an article or a self-contained piece of content.<section>: Used to define a section of content within a web page.<aside>: Used to define content that is related to the main content but not essential to it.<footer>: Used to define a footer section of a web page.<figure>: Used to define a figure or an illustration in a web page.<figcaption>: Used to provide a caption for a figure or an illustration.
Using semantic elements not only improves the accessibility of a web page but also makes it easier to read and maintain the code.
The <header> Element
The <header> element is used to define a header section of a web page. It typically contains a logo, a site title, and a navigation menu.
As an example:
Editor
The <nav> Element
The <nav> element is used to define a navigation section of a web page. It typically contains links to different parts of the site.
As an example:
Editor
The <main> Element
The <main> element is used to define the main content of a web page.
As an example:
Editor
The <article> Element
The <article> element is used to define an article or a self-contained piece of content within a web page.
As an example:
Editor
The <section> Element
The <section> element is used to define a section of content within a web page.
As an example:
Editor
The <aside> Element
The <aside> element is used to define content that is related to the main content but not essential to it.
As an example:
Editor
The <footer> Element
The <footer> element is used to define a footer section of a web page.
As an example:
Editor
The <figure> Element
The <figure> element is used to define a figure or an illustration in a web page.
As an example:
Editor
The <figcaption> Element
The <figcaption> element is used to provide a caption for a figure or an illustration.
As an example: