Home > UI/UX Development > HTML > Difference between semantic and non-semantic elements

Difference between semantic and non-semantic elements

semantic elements

  • Elements has meaning.
  • Describes its meaning to browser and developer.

Example

Some of semantic elements

  • <section><section> element is grouping content. We can split page into different sections.

  • <article> <article> element is independent and has self-contained content. <article> element used to write Forum post, Blog post, Newspaper article.

  • <header><header> element specifies header of document or section.

  • <footer><footer> element define footer for a document or section.

  • <aside><aside> element defines the content which will be set to the side.

  • <details><details> element define detail of your website. It may be visible or hidden.

  • <nav><nav> is one of the semantic element which define set of navigation link.

  • <time> – The <time> tag defines date/time.

 

non-semantic elements

  • Elements has no meaning called non-semantic elements.

Example

This Article is TAGGED in , . BOOKMARK THE permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">