Template Checklist for Web Developers

If you create templates for the college's web site, please keep in mind that the web pages must be designed to be accessible, well-structured, and easily maintained. Below are some general guidelines to help you with this process along with some helpful tools.

Div Tags for Sectional Structure

Be sure to use div tags to specify the different sections within the web page. Typically, a page consists of these sections:

Container
Header
Navigation - Primary
Navigation - Secondary
Content
Footer

Page Title

The page title is what is displayed in the browser’s tab for that web page. The code is located in the head section of the HTML page.

Example:
<title>Penn State Behrend</title>

Heading Tags (H1, H2, etc.) for Content Structure

Code for the heading tags is contained within the body section of the HTML page. Typically:

h1 – used for page heading
h2 – used for navigation
h3 – used for page title
h4 through h6 – used for other sections

Also, check for proper nesting of tags. One possible tool is W3C's Markup Validation Service. (Click Options, then check the “Show Outline” box)

Skip to Content Link

Include a skip-to-content link to make it easier for screen readers to navigate to the main content of a web page. See WebAIM's "Skip Navigation" Links for instructions.