Web Style Guide

Color & Typography Guidelines

Colors/palettes/schemes

Primary University Web colors

  • Red: #cb132a or RGB (203, 19, 42) - Closest visual equiv. to print PMS 186
  • Silver: #999999 or RGB (153, 153, 153)
Screenshot of University red and grey

Typography/Fonts

Font Family

  • Sans Serif: Arial
  • Serif: Georgia
Example of Arial and Georgia typefaces

Font Stacks

Display of fonts in Web pages depends on what fonts are installed on a visitor's computer. Font stacks address this problem by providing alternatives when the desired font is unavailable.
Font stacks are written as follows: primary-font-family, first-alternate-font-family, second-alternate-font-family, etc.

Sans Serif Font Stack: Arial, Helvetica, sans-serif
Serif Font Stack: Georgia, Times New Roman, serif

Font  Sizes

Font sizes should be set using relative measurements (in percentage and/or em units).
Font size must be adjustable by a visitor's Web browser; fixed font sizing is not permitted.
In general, the default size set by the Web browser (12 point) for paragraph text is the recommended minimum size.

Font Styles & Formatting (bold, italic and underline)

Bold (<strong>) and italics (<em>) formatting should be used to apply emphasis.
Bold and italic formatting should be used sparingly; typically no more than once complete sentence in any given paragraph should be formatted using bold or italic text.
Underline formatting may only be used to designate links.

Examples:

<p>This service is for <em>CI students only.</em></p>

will display

This service is for CI students only.

Examples:

<p>The deadline is <strong>January 2nd</strong> at 4pm.</p>

will display

The deadline is January 2nd at 4pm.

©