Web Style Guide

Logo and Image Guidelines

Logo

Note: Color variations still apply, as outlined in the "Identity Style Guide" provided by Communcation and Marketing.

Logo choice

Web pages on the University Web site must use one of the two Formal Logo variations shown below:

Horizontal and vertical examples of the formal CI logo

Typically, the official University Web page logo should be placed on a white background. Reversed versions (i.e., logo on dark background) are permissible, but should meet the requirements specified in the "Reversed Logo" section of this document.

Logo size Minimums

The logo may be resized for use on Web pages to no smaller than the following minimum dimensions:

Formal Logo - Vertical Version

168 pixels wide x 104 pixels tall

CI logo, vertical version with minimum dimensions

 

Formal Logo - Horizontal Version

230 pixels wide x 58 pixels high

CI logo, horizontal version with minimum dimensions 

Reversed logo

Logo color may be reversed, i.e., white text on a dark background.
Example:

Two CI logos, on dark grey background 

The background color surrounding the reversed text must meet University requirements for color contrast and be aesthetically pleasing.

Images/Photography/Graphics

Preferred file format

File format for images should be selected based on usage, and overall quality requirements.

JPEG format (.jpg) should be used for photos, graphics with gradients, and other photo-realistic images

GIF format (.gif) should be used for graphics with a limited number of colors, or images containing mostly text

File size

File size of images used in Web pages should be reduced using Web image optimization software.

Applications like Adobe Photoshop, GIMP, Picasa, and Photoshop Express allow users to resize images for use on Web pages.

Providing digital camera images in their full format on Web pages is not recommended, and should only be used when magnification of images is necessary to view image detail.

Image resolution

Images placed on Web pages should be set to 72 dots per inch (72 dpi).

Image sizes

Images should be resized and optimized for their final display size in pixels.

The following image sizes are recommended:

  • Thumbnails: 160 pixels wide x 100 pixels tall
  • Full-size images: 550 pixels wide x 288 pixels tall. This image size fits in the current maximum available width of the body of the standard CI template. This dimension also represents a pleasing 4x6 aspect ratio.

Image style

Images can be used for meaningful or purely decorative purposes.

Images should should be bright, clear, vivid, in-focus, and sharp.

Digital images and graphics should retain the proportions of the original as closely as possible. Images should not be stretched vertically or horizontally.

Images created in landscape orientation are typically more suitable to display on the Web.

Photos of actual students, employees and other CI community members are always preferable to stock photos.

Image collages or composite images are not recommended, as they typically appear cluttered.

Images should maintain proportions of the original artwork. Photos must not be stretched vertically or horizontally.

Image usage

Any photos or graphics used in a Web page are subject to copyright and must be cleared for copyright before being published to production Web sites.

Actual persons represented in any photo should be cleared using a Photo Release form, obtainable from Communication & Marketing.

©