Wide Page Template

This page is at once a template for other pages to follow, instructions for making new pages, and an example of a finished page.

To start, change the title variable in the head and the title in the H2 tag above.

Change the activenav variable to one of Home, Sites, Docs, Files, Accounts, and About. This sets the highlighted tab in the navigation bar. Note that acceptable values are defined in a SSI file and may change.

Then replace this text with a short summary of the page.

Section 2 - CSS Page Layout

The page has three main areas:

1. A primary content column
2. A secondary side-bar
3. A page footer

Additionally, there is a persistent site logo at the left, and a tab bar for site-wide navigation at the top of the content column..

Subsection 1 - Content

The content bar is made of several boxes, each of which corresponds to a major section. The boxes should share a background color for consistency.

Subsection 2 - Sidebar

Two divs in the raw source together provide the content for the sidebar: #sidetop and #sidebottom. This separation allows the Table of Contents to appear before the main content and supplementary material to come afterwards.

Sidetop should hold the Table of Contents for the current page, and its box should share the background color of the main content to show its close relationship with the content.

Sidebottom consists of other information related to the document such as Related Links, References, and Footnotes as well as general site-wide tools such as a search box. Content in sidebottom should use a different background color to indicate a looser relatinoship with the content.

Subsection 3 - Footer

The footer is a single box containing miscellaneous boilerplate information such as copyright info, standards-compliance info, contact info, etc. It should use a different background color than the content because it is not closely related to the content itself.

Section 3 - Page Structure

There are four levels of headers used:

1. The site banner uses the <h1> tag
2. The page title uses the <h2> tag
3. Primary sections use <h3>tags
4. Subsections use <h4> tags

A third level of section headers can be used (<h5>), but a shallower 2-level structure is preferable.

Subsubsection

Section 4 - Other

This page is meant to be a simple page. Refer to the design document for more examples of advanced CSS features.

Subsection 1 - CSS Text Features

The stylesheets feature explicit markup for the following:

1. blockquotes
2. abbreviations and acronyms
3. pre-formatted text blocks and inline code snippets
4. emphasized and strongly emphaized text
5. External links, links to pdfs, and email address links are marked with generated content.

Subsection 2