What is a Section

[alankellogg]

How is the section tag defined in HTML? What can be done with it? How is it used? How is it formatted? Can it be used much as sections are used in a word processor?

Edited December 12, 2015 by alankellogg

[Ingolme]

A section is a semantic element. It's a generic block element that doesn't actually do anything. By default in most browsers it's just a block with no background, border, margin or padding.

 

The MDN describes it well:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/section

The HTML <section> element represents a generic section of a document, i.e., a thematic grouping of content, typically with a heading. Each <section> should be identified, typically by including a heading (<h1>-<h6> element) as a child of the <section> element.

[AbigailMenard]

A section tag simple used for notifying different sections in a document like header , footer, chapters and paragraphs etc. It does not make any changes in your design, but just increases the understandability of HTML code.

ex.

<section>

<h1>Charles Dickens</h1>

<p> Charles Dickens is the most well known child author ever.</p>

</section>

[Ingolme]

The header and footer use <header> and <footer> tags.

[COBOLdinosaur]

Section comes out of the efforts of WHATWG branch of W3C. The technical recommendations around it are ambitous and there is a lack of real clarity on the difference between section and article that make them look to be redundant.The whole point of introducing a number of so called "semantic" block elements was to reduce the widespread use of div to carry flow data. having both section and article makes thing worse, not better. Keeping div to its intened purpose of carrying style, not content is desirable, but introducing multiple block elements without clearly defining their use serves no interest except the browser manufacturers who control WHATWG and who would rather have loose definitions so they can claim compliance with just about any impllementation.

 

As it stands section can be used anywhere in the body where a block element is allowed, and it is considered semantically correct. It can contain anyand all element types and it is considered to be semantically correct. The only limitation is the recommendation that is start with a header tag, but the validator only issues a soft warning if there is no heading. It is virtually a div with a different name so that it can be deemed semantically correct.

 

As a section the section tag does nothing in terms of real semantics that is not already applied to the hr tag.

 

However every standard from W3C over the years has started out with flaws and eventually they clean up the meaning of things so we know what should be considered "best practice".