What is the difference between <article> and <section> in html5

Article tag

The article tag is used for wrapping an autonomous content on a page. A content is autonomous if it can be removed from the page and put on some another page.

Section tag

The section tag is similar to the div tag, but it is more meaningful since it wraps logical groups of related content (e.g. a chapter of an article).

More about semantic tags - https://www.pluralsight.com/guides/semantic-html


The <section> tag:

The section tag defines sections in a document, such as chapters, headers, footers, or any other sections of the document.

The <article> tag:

The article tag specifies independent, self-contained content.

An article should make sense on its own and it should be possible to distribute it independently from the rest of the site.

Potential sources for the article element:

  • Forum post
  • Blog post
  • News story
  • Comment

Basically these tags are semantic elements and the only real difference between them are readability and design preference.

You can read more about them here if you wish:

  • http://www.w3schools.com/html/html5_semantic_elements.asp
  • http://www.w3schools.com/tags/tag_article.asp
  • http://www.w3schools.com/tags/tag_section.asp

Tags:

Html