Recognizing Semantics - HTML5 Mastery: Semantics, Standards, and Styling - page 113

Figure 3-8. The outline of the City Press web page

Looking at the outline, you can see that the text “The City Press” is the heading for
the body, which contains two nested sections, “Main Menu” ( nav element) and “Today:
Monday, October 10th, 2011” ( section element). Inside the “Today” section, there is
an article element ("More sunshine forecast…") and two aside elements, one for
the weather and one for the “City Voice,” which contains a blockquote from the article
story.

Adding text-level semantics

A great number of elements are available for marking up text inside paragraphs and oth-
er groups of content. These elements are used for defining which words precisely are
hyperlinks and what should be emphasized, labeled important, set apart from the rest of
the text, and so forth. We'll dive into each of these elements individually.

Hyperlinks: a
Links are most likely up there alongside paragraphs as among the first pieces of HTML
you ever learned, but we can still plumb the depths of obscurity and poke around at
a few potentially useful behaviors. Strictly speaking, the a element is not a link; it's a
hypertext anchor , which can either link to a new file, point to any element via its id
attribute, or, if it lacks the href attribute, act as a placeholder for where a link might
otherwise have been placed.
An exciting new change in the a element from prior iterations of HTML is that there
is much more flexibility in what can be placed as content inside the link. Any flow con-
tent can be nested inside, as long as it isn't from the interactive content category (but-
tons, links, and so on), so where in the past a link may have looked like this:
<a href="newpage.html">link text that appears on web
page</a>
it now can look like this:
<a href="newpage.html">
<section>

<h1>Wow an entire section in a

link!</h1>

</section>

</a>