The <section> Element
As defined in the HTML Living Standard, the <section> element represents a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
Structural Example:
<section>
<section>
Section 1: Introduction
Content for the introduction.
</section>Section 2: Details
Content for the details.
</section><section>\n <h2>Section Heading</h2>\n <p>Section content...</p>\n</section>
View HTML Living Standard: The section element
Section vs. Div
The <section> element is semantic, whereas the <div> element is not.
- Use <section>: When the content is a thematic grouping of content, typically with a heading.
- Use <div>: For purely presentational purposes (e.g., wrapping elements for CSS layout).
WCAG Requirement: Info and Relationships
Success Criterion 1.3.1 (Level A): Information, structure, and relationships conveyed through presentation can be programmatically determined.
Using <section> with a heading allows assistive technology to identify the thematic boundaries of the content.