Help Search SiteMap Directories MyMHC Home Alumnae Academics Admission Athletics Campus Life Offices & Services Library & Technology News & Events About the College Navigation Bar
MHC Home Web Policies and Style Guide for MHC
Dreamweaver
Page Elements
Page Layout
Banner
Heading
Page Title
Navigation
CSS
Page Footer
MHC Fonts
MHC Colors
Document Interface
News & Highlights
Return to Script
Search Tool
Images
Rotating Images
Popup Browser
Redirect Page
Links to Existing
Content

Connect to Web Server

Planning
bullet ADA
bullet Architecture
bullet Target Audience
bullet Things to Avoid
bullet Check List
bullet Home Pages
bullet Production
bullet Software
bullet Timeline

Utilities
bullet Go Script
bullet Hit Counters
bullet WebMail Forms
bullet DataBase Forms

Related Links

The Web at MHC

RedDot/CMS

Visual Identity Guide for Print

MHC Logos

Note: This Web site pertains to the pre-2006 MHC Web design. For the latest College design and RedDot/CMS, see The Web at MHC.
Quick Links
Site Management
Review Progress
File Size
File Names

Production

Production is the process of creating content, images, and populating the Web site. We suggest that you create templates for one or two sample pages for the core group to review. Once the group agrees on page layout and design, then populate your Web site. The sections below provide provide an overview of the process.

Site Management

Site Management is about files and folders and their location on the Web server. The organization of your Web files and folders should follow the same type of order as a filing cabinet. Create folders and place similar file types items inside each folder to make it easier to find things. For example, place all your images in one file folder named images so it is easy to locate the images quickly when you want to insert them on a Web page.

Example of file structure

The individual responsible for building the Web site should determine the file structure before they begin to populate the site. They should also be familiar with the importance of index pages. The example below reflects how the file structure is set up in the English Department Webspace. In this example, notice

  • The root folder is titled "engl" and it contains additional folders.
  • Images are in a folder titled "images".
  • All the faculty and staff profiles (HTML pages) reside in a folder titled "profiles".
  • Photos for those profiles are inside the "images" folder, in another folder named "profiles".

If you want to update a Web page, and you aren't sure where to find the file in Webspace, first go to the page on the Web. For example, if you wanted to update the profile for English Professor Demas, the URL is: mtholyoke.edu/acad/engl/profiles/demas.shtml. In Webspace, you would open the acad folder, then the engl folder, the profiles folder, and there you will find the page named demas.shtml. Note: you must have access authorization to the acad/engl folder before you can make changes to any files on the English department's Web site.

Review Progress of Web Development

It is important to set a date to reevaluate the full project timelines. About a month before the scheduled "go live" date, meet again to assess what is crucial to be completed by the time the site is live. Due to time restraints, there may be parts of the site that you will add later as the content becomes available.

File Size

Your visitors will lose patience if you site takes too long to download. Therefore the file size for Web pages should be keep under 75K. If your pages exceed this size, you may want to consider splitting the document into additional Web pages as well as reducing the number of graphic files per page.

Images are often the cause for slow loading Web pages. Graphics should be optimized for the Web so that the file size is as small as possible without losing the quality of the image you want displayed. Another option is to display a thumbnail image which links to the larger image on a separate page. If the larger image will be slow loading, alert your visitor by including the file size with the thumbnail link. If you are using Dreamweaver as your HTML editor, the file size and downloading time are indicated at the bottom right side of the window (as shown below).

Example of file size view in   Dreamweaver

File Names

  • Avoid spaces in file names
    When naming files or images AVOID SPACES. You can use an underscore or dash to break up words if necessary; i.e.: file_mgmt or file-mgmt.
  • Create simple file names
    Consider naming HTML files the same as the title of the page. Users often try to decode the Web address of pages to infer the structure of Web sites. Thus, file name and folders should contain descriptive directory and file names that reflect the nature of the information space.
  • Avoid special characters
    Characters make it hard for users to type the URL and, in some cases, pages will not be visible in a Web browser if there is a character in a file name.
    - Avoid using tilde (~) and special characters.
    - Avoid any non a-z, AZ, or 0-9 characters.
  • Use lowercase file names
    Users sometimes need to type the URL, so try to minimize the risk of typos by using short names with all lower-case characters. This is a guideline and not a firm rule, except if you are in Web CMS where no caps are permitted.
  • Be careful of using dates in file names
    A file name should remain constant. Therefore, be careful when using dates in your file names. Consider using a date only for archival purposes.
  • Use clear and consistent with file names
    • Clear: jan2005.html, feb2005.html, mar2005.html
    • Inconsistent: 2005-january.html, 0205.html, 03_05.html

Mount Holyoke College Web Style Guide 2007
50 College Street, South Hadley, MA 01075

Email suggestions or questions.

Copyright © 2008 Mount Holyoke College. This page created by MHC Web Policy Committee and maintained by Theresa Chamberland. Last modified on February 18, 2008.