Generic Header at University XYZ


Shortcuts

Purpose  Wide Graphic  Shortcuts  White Space

Internal Jumps  Source Code


Purpose of this Template Page

This template file is intended to be informative, to demonstrate one possible way to organize your home page, and to serve as a starting point for your own creativity. Please feel free to copy this page. In Netscape you can use the "Save As" choice from the "File" menu (be sure to set the Format to "Source" rather than "Text").


Wide Graphic

The wide header graphic at the top of the page may contain embedded text, or not. If it does not, you may well choose to include a leading <H1> header, which we omit here, to function as a visible title for the page. The graphic should be at most 530 pixels wide and between 75 and 250 pixels tall. The <IMG> tag should contain explicit ALT, HEIGHT, and WIDTH attributes, so that display of the text can proceed while the image file is being loaded and displayed. The height limit is based on the advantage of having all the shortcuts visible on the first screen, so that people can get where they want to go without being forced to scroll down at all. The width limit is based on wanting to see the entire graphic, even when viewed using the comparatively narrow default window width of Macintosh Netscape, or when printed in portrait mode.


Shortcuts

The shortcut links just below the graphic provide a direct path to the primary information available from this page. In the case of this template file, each of them functions as a Table of Contents entry (except the "Source Code" shortcut). In situations where the actual information is on other pages (such as is the case for the source code), the shortcut should be a direct link, and should not jump you down within the same page (to a place from which you would then have to jump yet again to get where you want).

The shortcuts themselves can be text, as is the case in this basic page, or small graphics.

If you present the shortcuts on two or more rows, make sure that they are separated by a paragraph tag (<P>) rather than a simple line break (<BR>), so that people with impaired mouse skills can still comfortably use your page.

Because the shortcuts are very terse, it is a good idea to provide a more complete explanation of the information to be found by following each of those links. This page demonstrates one way to do that: the bulk of the text is a definition list (using the <DL>, <DT>, and <DD> tags). Each of the Defined Terms is also a header (you can reasonably choose either level 2 or level 3, depending on your preference for the displayed size of the text). Each of the Defined Terms that is the target of a link from the shortcuts is also enclosed in an anchor tag to NAME it. Each of the Defined Terms that links to information elsewhere is enclosed in an anchor tag with HREF identical to the one used in the matching shortcut.

The shortcuts are presented in the same order as their explanations in the definition list.


White Space

Use white space (extra hard returns) in your HTML file to separate items that will be set off by headers, list structures, paragraph breaks, or horizontal rules. This makes it easier to edit the file.

Use white space in your HTML document to make it easier for the reader to grasp the organization. This can include <P>, <BR>, and <HR> tags, as well as headers and list structures.


Internal Jumps

You can use anchor tags to name a particular location within your file, and then create links that jump to that location from within that file or from external files:

Return to top of file.


Source Code

You can inspect the source code for this template file directly, even if you are using Netscape on a machine that does not have adequate memory to use the View Source option.


Return to Home Page



Dick Piccard revised this template file (http://www.ohiou.edu/pagemasters/class/template.html) on October 25, 2000.

Please E-Mail comments or suggestions to "acatec@www.ohiou.edu".