WEB STANDARDS CREATIVITY

248
After the main link is clicked, the navigational pane will slide into its final position, as shown in Figure 10-4.
Figure 10-4. The “exposed” state, when one of the navigational panes is in its new position, visually just below the main navigation
These represent the two “states” for each tab: when the information is hidden and when it is exposed (this will be important
later when we examine the CSS and JavaScript portions of the solution).
Starting with pristine HTML
In order to make any site or web application work, we need a solid foundation of content and functionality that is provided
via clean HTML. Not only should the HTML be meaningful in terms of its content, but it should also be meaningful in terms
of its functionality. Though most people tend to consider HTML only as content, it does provide basic functionality through
form fields and links. Later in the chapter, we’ll use these links as the basis for the interactive part of the scripting.
We need to implement three main areas of HTML for this solution:
Navigation area
Main content
Additional content in the footer