C V M B S   W e b   S i t e   S t y l e   G u i d e

Page Design

Ampersand (&)
An ampersand should be used only when it is part of a formal name: Research & Development. Otherwise it should not be used in place of "and."

Ampersands are to be coded as & if they are in the body of the document. If they are in the title of the document they should be typed as &.

Bold Text
If you need to emphasize something with bold text use <STRONG>...</STRONG> instead of <B>...</B>.

Italic Text
If you need to emphasize something with italics use <EM>...</EM> instead of <I>...</I>.

Color
Choose colors for your pages from CVMBS's Web palette. But don't overuse colors for emphasis in a document or the reader will be confused as to where the emphasis lies.

Do not use a color to impart information, i.e., (on forms) "Required fields are in red." Use an asterisk (*) instead.

Headers
Headers (large size green text) are the main header on a Web page and introduce the subject of the content of the page.

• No header should be more than two lines long.
• The only header approved is <h1>. Don't mark up with FONT tags.
• In a two-line header, divide the lines in half with a <br /> tag (or as nearly so as is possible) so that the lines are nearly equal in length. (Line 2 should never be just one or two words.)

Hyperlinks
The minor pages must have at least one text link centered at the bottom of the page. Use <p class="links">...</p> coding. Additional text links to lower layers may be used. Insert a space-pipe-space (link | link) between the name of each link.

If links are needed at the bottom of a top level page, they should be coded using the same method as described for minor pages.

Create all hyperlinks as relative links <a href="/images/csu_logo.gif"> rather than absolute links <a href="http://www.cvmbs.colostate.edu/images/csu_logo.gif">.

If the link is a clickable image, turn off the borders by using border="0".

Lists
The beginning letter of the first word in each line of a list should always be capitalized.

If your list contains items that stay on one line (doesn't wrap to a second line) then do not put blank lines between bulleted items. See above example.

If you have a list containing items that are more than one line long, then seperate the bulleted items with a blank line. See HTML coding: Lists for how to do this.

If you have a list that contains both items that are one line long and more than one line long, use your judgement to determine which of the two above methods will make the list more readable.

Page Length
Pages should be kept to the shortest length possible. For long documents consider dividing up the text and adding links.

Template
Each page must incorporate the CVMBS logo for that page and section links. The CVMBS generic template, should be used when authoring a Web document. The templates include graphics and initial coding, including metatags, that are common to all documents.

Special Effects
Special effects such as animation, video, audio and multimedia files should follow the College-standards (Example: video should be .mov QuickTime format vs. .avi or .mpeg).

Tables
Tables used for layout should not have borders. Tables used for data should have borders only when the information really can't be made clear without them. Consider using colors for cells instead of turning on borders.