HTML and CSS Reference
FIGURE 1-5 Using the <article> element to segment different articles on the page
You have expanded the document to include three articles. Clearly, you don't want to
put the entire chapter into the sample HTML document, but you'll add enough to be able to
demonstrate the function of each semantic element. Each article added to the document in
this example represents an independent part of the document that can be wholly contained.
Typically, the first element within the <article> element is a header element or header group.
Closely related to the <article> element is the <section> element, which you explore next.
Using the <section> element
The <section> element subdivides pages into sections. You could continue to break down
the sample page with additional <article> elements; however, the purpose of the <article>
element isn't to break down a page into more granular details. This is where the <section>
element becomes useful. Each <article> element contains zero or more <section> elements to
denote the different content sections within the <article> element. Like an <article> element,
the first element within a <section> element is typically a header or a header group.