Contact Us Search Site Index About This Site Edit Decrease text size Increase text size Georgetown University main web site Contact Us Search Site Index About This Site
spacer spacer spacer
University Information Services at Georgetown University
Faculty Help Staff Help Student Help About UIS
 

HOME » WEB DEVELOPMENT » AUTHORING AND PUBLISHING

WEB ORGANIZATION AND DESIGN

Directory Structure and Organization of Files

Before you begin creating Web pages, you should plan ahead and create a directory structure for your Web files. Your directory structure will affect the URLs (Uniform Resource Locator, or Web site address) and your options for letting other people work on your Web files.

  • It is generally a good idea to organize materials in separate subdirectories for different projects. For example, if you are a faculty member, you may want to create a separate subdirectory for each of your courses or research projects. This will help you stay organized and it will give the materials distinctive URLs that differentiate them from other materials. Keeping materials in separate subdirectories also makes it easier to change ownership of the files at a later date. For example, if your research assistant takes over the files for a specific project, you will be able to transfer the entire directory to the new owner.

  • Your directory structure becomes part of the URL for the materials. For example, files for a course might have the URL http://www9.georgetown.edu/faculty/jonesk/chem101/ where chem101 is a subdirectory of Professor Jones' www directory. Therefore it is important to plan your Web directory tree in advance so that you do not need to move files to subdirectories at a later date. Moving or renaming a Web file invalidates the links to that file created by users, causing inconvenience to those who wish to use your files and ultimately disrupting the stability of the Web as a whole. Plan ahead!

  • If you want a particular file to be the default file for its directory, you should name it index.html. This will help shorten the URL, since users will not need to specify the file name. For example, if Sally Sty has an index.html file in her www directory, users will get that file when they go to the URL http://www12.georgetown.edu/students/stys/. This also helps protect your directory, because if there is no "index.html" files in a directory, users will be able to get a directory listing if they type in the URL.

  • File names should be easy to understand and not too long. Do not use spaces in any of your file names. URLs and file names are case sensitive. It is generally a good idea to use only lower case letters and no special characters in your directory and file names.

Link Maintenance

Unfortunately, developers often move materials on the Web, and then links you have made to those materials will become broken. Therefore, it is a good idea to check the links in your Web pages frequently.

Many of the newer editors such as Dreamweaver have the capacity to check all the links in your documents. The W3C also offers a Link Check service in which all the links in a page will be checked after you enter the URL of the page.


General Recommendations

  • Document Size - In general, the larger the size of your HTML file, the longer it takes to download to the client. Consider logically dividing up large documents into separate linked pages to reduce wait time. However, if you have a large section of material that is one logical entity, don't feel that you must arbitrarily divide it into smaller pieces. A user may find it worth the extra wait to be able to freely scroll up and down to follow a single subject rather than following arbitrary links. Also, if you think users will want to print the information you are presenting, having the materials on a single page can be a big advantage, since users can easily print the entire file. If you do have large documents, you can help make them more navigable by breaking them up into discrete sections with internal links going to a table of contents.

  • Layout - Lay out your material to create a strong visual impression when a page is loaded for viewing. Consider the size of the client's viewing area so that a complete image or thought is presented in the initial screen. Consider a table of contents page or menu as an effective way to present a clear, up front view of the material covered, plus a means of providing easy-to-use links to other pages. There are a number of templates available to assist you in laying out your information.

  • Browser Compatibility - While Internet Explorer is the standard Web client program for most Georgetown University Web users, some users access our site using Mozilla Firefox or other browsers. This might limit the user's access to some features. As a general rule of thumb, make files accessible to as many users as reasonably possible by using alternate tags, such as ALT tags for images and NOFRAMES tags for frames.

  • Accessibility - All new University Web pages must be accessible to users with disabilities. The minimum standard in this regard is a federal regulation called Section 508. More information is available from the GUide Committee or on the federal Access Board Web site.

Templates

There are a variety of different templates available for creating pages that have a common format using the graphic standards developed by the GUide Committee. The templates can be found at http://guide.georgetown.edu/manual/templates.html .

  • Templates contribute to the overall continuity and graphic identity of the Georgetown Web structure, as well as making development easier and faster. You can open the template files in Dreamweaver or another Web editor and then modify them by inserting your own text in place of what's there. These templates use the following HTML markup to establish the text color (black), background color (white), link color (blue), visited link color (gold), and active link color (dark green).

  • There are a number of templates available. The simpler templates include the basic template without graphics and a template with simple header and footer bars. These two templates use the standard Georgetown design with the white background. Their simple structure makes them suitable for any page with a lot of information to convey, and it gives you more leeway to insert images, tables, and other graphic elements in your own arrangement.

  • There are also more complex templates, including those with full page borders. There are single column templates with full borders as well as two column templates with full borders. These types of templates are recommended for use as the home page for departments, organizations, and administrative units. The columns are fairly sensitive due to the fact that they were created using multiple embedded tables, so be careful not to insert an image, graphic element, or horizontal rule that is wider than the column width.
spacer