HTML and CSS Reference
In-Depth Information
<ARTICLE> AND <SECTION>
Now let's look at HTML5's improved semantics. First up, HTML5 provides two
elements—
<article>
and
<section>
—for separating your main content into
distinct pieces on your sites. They are often misunderstood, so let's tread carefully.
Let's consider a blog site, which has a main content column containing blog-post
summaries and a secondary content column containing the author's latest Tweets
(see blog-site.html in the chapter2 folder for the full code).
Yo u w o u l d t r a d i t i o n a l l y m a r k t h i s u p u s i n g s o m e t h i n g l i k e t h e f o l l o w i n g :
<div id=”main”>
v >
<!-- post summary -->
>
v >
<!-- post summary -->
>
<!-- etc. -->
</div>
<div id=”tweets”>
<div class=”tweet”> ... </div>
<div class=”tweet”> ... </div>
<div class=”tweet”> ... </div>
</div>
