ptg16476052
HTML5 Structural Tags 375
13
HTML5 Structural Tags
Now that you’ve seen a full page built using HTML5, let’s look at the individual struc-
tural tags and which semantics they represent. The new tags don’t provide an advantage
in terms of styling your pages; you can provide the structure you need for styling using
dard vocabulary for describing the structure of a page. This vocabulary makes it easier to
build software that extracts information from structured pages so that it can be presented
in alternate ways. The key, though, is for developers who are using these tags to use them
in the manner consistent with that vocabulary.
Sections
It’s helpful to think of the structure of a web page as an outline. The top-level structural
element of a page is the element. The next level is represented by the
and elements. In HTML4, the only element available for dividing the page into
further sections is the
with the
As you might expect, the
document. The other structural tags in HTML5 are used to define document sections with
more specific semantic meaning. A
for that section. You’ll learn in more detail how headings and document sections interact
a little further on.
Here’s an example of a section:
Board Members
The board members for 2014 to 2016 term are as follows.
- Lis a Smith, Chairman
- Joe Brown, President
- Sheila Robinso n, Vice President
- Wanda Nichols, Treasurer
- Ronald Jones, Secretary
While styles can be applied to the
of a page on its own. You can also nest
subsections. That said, you should use more specific elements when possible to avoid the