WPI Web Design Specifications

* indicates the item is covered in the Web Policies, and is restated here in more specific language.

Overall

Make use of rules, quarter round, and rounded rectangle elements consistent with university-wide web and print designs.
Elements of design should be consistent with other related material (printed matter, marketing promotions, etc).
Use official WPI CSS as a base for text and table formatting.*
Do not use frames technology.*
Do not use red other than official WPI crimson
Anything presented in WPI crimson must be clickable. *
Text links must use official WPI CSS link and visited link colors (WPI crimson and gray respectively) *
The color of main menu text (graphical and plain text) must be either the official WPI crimson or white (preferably on a crimson button/background).*
Graphical menu text will be in Futura and no smaller than 13pt, typically in bold or heavy weights. *
Buttons will have normal and mouseover states.
Design should be functional at 800x600 resolution without horizontal scrolling and be visually appealing at higher resolutions.*
Navigation should not be dependent on JavaScript, Java, Flash, or plug-ins.*
All necessary content should be accessible or alternately accessible without the use of on JavaScript, Java, Flash, or plug-ins.*
All necessary content should be viewable with version 3 & 4 browsers and be fully compatible with version 5 browsers and above.

Use of WPI logo with positioning statement wherever possible.*
WPI logo may appear anywhere within the layout as long as appropriate breathing room is given per Identity policies.
If department has its own positioning statement, it should closely relate to the department name and distance itself from the WPI logo per Identity Policies .
Elements consistent with lower level pages.
Design should be built to expand depending on the size of the user's window or at least be centered and look integrated with the rest of the window.*
Main design elements and menu should fit on 800x600 resolution screen without horizontal scrolling.*

Sidebar zone is 200px wide. *
20px between sidebar and page copy. *
Main menu buttons may be text or graphical, and all expanding submenus where necessary will be text-based and Arial, Helvetica based on the official WPI CSS. *
Buttons on large sites will also have down states for when you are in a section.

Top bar zone is 85px tall. *
Top bar text fits vertically within WPI caps height. *
Unless related materials use alternate fonts, titles in top bar will be Garamond Semi-Bold Italic or Futura Family depending on the family the site belongs to. *
For large sites, top bar may change to have section name as the title with department/division name above in all caps Futura. Photo in template may also change per section as long as it does not cause a disorienting change to the department template look and feel. *

Maintained by webmaster@wpi.edu
Last modified: Aug 31, 2004, 16:16 EDT