Web Guidebook: Style Guidelines for Academic Department Websites
Navigation Elements
Academic departments may choose to use the FSC navigation bar at the top of each web page. The navigation bar is available in four colors.
*Note that the navigation bars should never be "Saved" from the web using a web browser and then used to create a web page.
The navigation bar can be obtained using one of two methods:
- Download one of the below blank web pages (note files are .cfm and need to be saved with that extension) that already contains the navigation bar.
Windows: Right click one of the links and choose "Save Target As..." or "Save Link As...".
Mac: One-button users should click on the link and hold the button down until a menu appears. The commands are "Download Link to Disk" or "Save this Link as..."
White Navigation Bar Page
Black Navigation Bar Page
Green Navigation Bar Page
Blue Navigation Bar Page
- or -
- Insert two snippets of code into the HTML of each page in your website. Note that the navigation code is written in ColdFusion so web files must be saved with a .cfm extension.
White Navigation Bar
Insert the following between the <head></head> tags:
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT" SRC="/community/_scripts/rollovers_nav_strips_wh.js">
</SCRIPT>
Insert the following just after the <body> tag:
<!--TOP NAVIGATION STRIP-WHITE-->
<cfinclude template="/community/_includes/white_nav_strip.txt">
<!--END TOP NAVIGATION STRIP-WHITE-->
|
Black Navigation Bar
Insert the following between the <head></head> tags:
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT" SRC="/community/_scripts/rollovers_nav_strips_blk.js">
</SCRIPT>
Insert the following just after the <body> tag:
<!--TOP NAVIGATION STRIP-BLACK-->
<cfinclude template="/community/_includes/black_nav_strip.txt">
<!--END TOP NAVIGATION STRIP-BLACK-->
|
Green Navigation Bar
Insert the following between the <head></head> tags:
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT" SRC="/community/_scripts/rollovers_nav_strips_gr.js">
</SCRIPT>
Insert the following just after the <body> tag:
<!--TOP NAVIGATION STRIP-GREEN-->
<cfinclude template="/community/_includes/green_nav_strip.txt">
<!--END TOP NAVIGATION STRIP-GREEN-->
|
Blue Navigation Bar
Insert the following between the <head></head> tags:
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT" SRC="/community/_scripts/rollovers_nav_strips_blue.js">
</SCRIPT>
Insert the following just after the <body> tag:
<!--TOP NAVIGATION STRIP-BLUE-->
<cfinclude template="/community/_includes/blue_nav_strip.txt">
<!--END TOP NAVIGATION STRIP-BLUE-->
|
Images
When saving images use the following general guidelines:
Photos: The web file format for photos is JPEG.
Graphics: Most non-photographic images should be saved as a GIF file (also called CompuServe GIF or Graphics Interchange Format).
Colors
The color values of the navigation bars are as follows:
White: #ffffff (RGB Value = 255/255/255)
Black: #000000 (RGB Value = 0/0/0)
Green: #003300 (RGB Value = 0/51/0)
Blue: #003399 (RGB Value = 0/51/153)
Web Editors
Many web editors will work fine with the navigational bars, however, standard web editors on-campus are FrontPage (Windows) and Dreamweaver (Mac). To get this software installed contact a website support person.
Maintenance
It's important to keep on top of your web updates. More and more, people are using the web as a major information source. Out-dated information can be more detrimental than none at all.
List a contact person for visitors to email in the event that there is a broken link, etc. to report.
|