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

ment, and focus instead on creating labels that could sit above major sections of content.
For instance, you might come up with something like Figure 3-1 for a simple homepage.
Figure 3-1. A simple homepage outline
Think of this list as the table of contents or site map for your website's content, what
comes before what, and what is a subsection of a larger section. In this example, the
website's title (perhaps a company name) is the piece of information all other content
falls under. Below that is the main navigation to other pages (remember this is the big
picture, so individual links aren't shown in this example), and next comes the featured
content on the homepage, which includes a featured article with a brief summary of
the article's contents. Lastly, the other articles on the homepage are placed in an “Other
News” section.
Developing a list like this can help you organize and visualize the hierarchy of in-
formation on your site, but this isn't just a lofty exercise that may or may not help when
developing your website—the HTML5 specification actually provides a concrete al-
gorithm for building a website structure based on an outline such as the one in Figure
3-1 . Not only that, but the algorithm is a great guide for learning how to properly struc-
ture your web pages.