Skip to main content
more options

LTS Style Guidelines and Samples

 

This document contains guidelines and examples of style conventions for the LTS Website, listed in alphabetical order. It should be noted that while most of these conventions were followed in the CTS Website and the previous incarnation of the LTS Website, the code does not always translate correctly when copied and pasted from the older sites.  We will need to confirm that each page conforms to the style guidelines in order to ensure a uniform, professional web presence.  This document is a working document and will be edited and appended as needed.


 

Bulleted Lists

  • Are recommended for lists of links, or non-hierarchical lists of any kind.  There should always be more than one item in a bulleted list.
  • Are recommended for lists of citations, as in lists of publications by LTS employees.  Authors' names should be in bold letters in these lists.
  • May be flush left, or indented under a heading and prefatory paragraph, if appropriate for the context.

Capitalization

Capitalization should be used consistently in titles and in the navigation bar.  i.e. "LTS Web style guidelines" should be "LTS Web Style Guidelines."

Color

In case you would like to manually enter color tags into the HTML, the proper codes for "official" Cornell website colors are as follows:

  • Black is "000000"  (Those are zeroes, not capital O's.)
  • Gray is "686456"
  • Red is "B31B1B"
  • White is "FFFFFF"

E-mail

When creating an e-mail link, do not place the full e-mail address in the text for the page.  Create an e-mail link on either the person's name or their net id, without "@cornell.edu," so that people using "screenscraping" tools cannot acquire the e-mail address.  "Burying" the full e-mail address behind the link will protect the person's e-mail account from spam and malware.


Fonts

All text should be black, unless it contains a link, in which case the CSS will automatically change the color to red.  All text should be the default font.

  • Encoding for page titles should follow this example:

<p align="center"><font size="3">LTS Style Guidelines and Samples</font></p>

If you edit the font size and alignment for a title using the "Normal" view of the editor, the settings should look like the following illustration:

Be aware that if you edit using the "Normal" view, there may be some spurious code left in.  This can keep your title from displaying properly.  If you look at the code and see multiple font tags, or any <span class> tags, you need to remove them from the code.  The "HTML" view of a properly encoded title looks like this:

  • Encoding for subtitles (or subheadings) should follow this example:
    <p align="left"><font size="2"><strong>Capitalization</strong></font></p>
  • Encoding for body text should be <font size="2">, unless a compelling argument can be made for using <font size="3"> for better readability/ better design choice.  (See Who We Are.)

Hard Rules

Hard rules, or lines, often used to indicate sections in procedures, should be coded as follows:

<hr align="left" color="B31B1B" noshade="noshade" size="1"/>

This encoding creates a thin red line.  All hard rules in this site should conform to this format.

Indents

Tables and text for a paragraph or section should be flush left unless it is part of an outline, in which case standard indentation protocol for outlines should be followed. An exception should be made for text used as an illustrative example, as have been made for examples of HTML code in this guideline document. See also "Bulleted Lists" for a discussion of the use of their indentation rules.

Special Notes on Procedures Formatting

  • The headings "Scope," "Contact," etc., should be flush left, and should be bold.
  • The text of the "Scope" section should be in italics.
  • The Table of Contents for any procedure should be in "regular."

Tables

Tables should have a border of "1" with a cellspacing of "0" and a cellpadding of "5," as in the example that follows:

<table cellspacing="0" cellpadding="5" width="90%" border="1">