Georgetown University Home | A-Z Index Contents Directories Search 
Georgetown Guide to the Web

The Georgetown University Guide to the World Wide Web provides information for both beginning and advanced Web developers.

Table of Contents

What is the World Wide Web?

Overview of Web Support, Coordination, and Policies at Georgetown

Getting Started

Web Development Tools Web Organization and Design Recommendations Copyright

Site Administration and Maintenance

Advanced Web Development and Interactivity Further Resources and References

Conclusion


What is the World Wide Web?

The World Wide Web is a hypermedia system for transferring text, image, sound, and video files over the Internet. The Web is based on standard Internet protocols, the most common of which is HTTP, the hypertext transfer protocol. The Web also encompasses other Internet resources by allowing the use of gopher, email, FTP, and telnet connections. To learn more about the history of the Web, as well as new Web technologies, go to the World Wide Web Consortium (W3C)

The Web "system" actually consists of at least three parts: 1) the content of the Web (the files and data that are delivered by Web servers); 2) Web servers (Internet computers running Web server software which deliver files to users); and 3) Web client programs (software that displays or plays the Web files for users and processes requests for additional files). The client and server software work together in a sophisticated exchange of protocols and transfer of information, but all of this happens behind the scenes and Web users generally don't need to understand the intricacies of the system. Web client programs (often called "browsers") are designed for ease of use; users just point and click to have materials delivered electronically to their desktops. 

A URL, Uniform Resource Locator, identifies the exact location of a file on the Web. URLs are case sensitive, and all spacing and punctuation must be exactly right. Using Netscape, you can use your mouse to highlight and delete the URL displayed in the "Location" or "Netsite" box at the top of the screen, type in the URL you want, and hit "Enter". If you have specific URLs, they will help you go directly to specific resources on the Web. 

For more information about the Web, UIS offers a number of general training classes on Netscape Navigator and  Effective Web Searching, among others. 


Overview of Web support, coordination, and policies at Georgetown

The service provider for most Web development at Georgetown is University Information Services. This development is done primarily under www.georgetown.edu. If you think you may have access to development space on a Web server other than www.georgetown.edu, consult the list of Service Provider Contacts. Each Service Provider should maintain a checklist of procedures for Web Development on their server(s). Be sure to follow the procedures established by your service provider. 

Coordination of Georgetown Internet resources is provided by the GUide Committee (G.U. information delivered electronically). This committee represents a broad cross-section of the Georgetown community, and interested faculty, staff, administrators, and students are invited to participate. 

All individuals who develop materials for the Web at Georgetown must abide by the Computer Systems Acceptable Use Policy and the Internet Development Mission Statement and Principles. Please read these documents before you begin Web development.


Getting Started

Responsibilities of Web Development

It's easy to create your own Web page with one of the many WYSIWYG programs that are now available. But if you plan to develop resources that will be a respectable representation of your work, your department, or your organization, and by reflection the University as a whole, you need to consider the broader implications of Web development. 

Before developing materials for the Georgetown Web, take time to get familiar with the Georgetown site and the Web in general. Use the GUide University-wide Search Engine to find other Georgetown pages related to your topic. You may discover documents to link to your own, and you may find that you can refer to existing resources rather than creating new ones.. 

You will need to invest some time in learning how to use software tools to create Web files. In addition, once Web files are made public, they require maintenance. When you make files available on the Web, you are creating a public access resource that Web users around the world will refer to as they add your URLs (Uniform Resource Locators) to their bookmarks and create links to your files from their own Web files. The metaphor of the "web" is appropriate, in that World Wide Web files interconnect to form an extremely elaborate and sophisticated pattern of cross-references and interrelations. If you move or remove your Web files after they have been made public, you tear a hole in the Web, and anyone who has created links to your materials will find only error messages. Furthermore, poorly maintained Web files reflect badly on the University as a whole, and out-of-date Web materials are in some cases worse than not having the materials available at all. Therefore Web developers should be willing to make a commitment to provide a stable structure and long-term maintenance for their files. 

After you have created Web files, you are responsible for transferring these files to another owner or another server before you leave the University. Your service provider is not responsible for files that may be lost when your account is deleted after you leave the University. To request a transfer of files to another developer on GUSUN, use the Web services form. For your own files, such as your resume, you will need to find a new Web service provider and transfer files to that account before you leave the University.

Georgetown Web developers are responsible for following all applicable policies and laws that pertain to Web publishing. At Georgetown, these include, but are not limited to, the Computer Systems Acceptable Use Policy and the Internet Development Mission Statement and Principles. Web developers must read and agree to abide by these policies before making materials available on the Web. In addition, all members of the University community are bound by federal and local laws relating to civil rights, harassment, copyright, security, and other statutes relating to electronic media. 

What you will need to begin Web development

  1. An account on a Web server 

  2. For development under www.georgetown.edu, you will need a GUSUN account. If you do not have a GUSUN account, you can apply for one online. You should plan ahead, since you will have to wait for your request to be processed.
  3. Webspace in your account 

  4. GUSUN accounts do not automatically come with a directory for Web development, since not everyone wants to do Web development. To apply for Webspace in your GUSUN account, fill out the online Web application form, which will create Webspace in your GUSUN account overnight.
  5. Web development software 

  6. There is a variety of Web development software available. UIS supports Netscape Composer, which is all most developers need. For more advanced developers, we recommend Homesite from Allaire. For more detailed information, see the relevant sections below. 
  7. Help? 

  8. If you need it, a variety of help is available to you. For more information on training courses, discussion lists, and other support, see the UIS Web development page or contact your service provider.

Web Development Tools

Since the Web is platform independent, Web development can be done on Windows, Macintosh, or other systems. The process for designing Web pages is basically the same whether it is done on a Windows or a Mac computer, with only slight differences in the software tools. Besides the tools described below, users can also turn to the Web Developer's Journal, the Web Developer's Virtual Library, Softseek's Web Publishing Tools, or the Internet Product Watch for the latest information on Web development software. 

Netscape Composer

Netscape Composer, part of Netscape Communicator, is a WYSIWYG (What You See is What You Get) program that allows you to create, edit, view, and upload your Web files all with the same program. It provides many useful features for beginning and advanced Web development, and it is extremely easy to install and use. If you have Netscape Communicator 4.0 or higher on your computer, you already have Netscape Composer-- look under the Communicator menu. Netscape Communicator can be downloaded directly from Netscape Communications Corporation. For help using Netscape, look under the Help menu.

In addition to the recommendations below, you can sign up for Web training classes or review the class notes at http://www.georgetown.edu/uis/web/training/

Setting Preferences in Netscape Composer - Before you begin using Netscape Composer, you should set the preferences. If you are working in a lab, the general preferences will already be set. 

  1. Choose Edit | Preferences from the drop-down menu in Netscape Communicator.
  2. Click once on Composer in the list on the left.
    • For "Author" name, type in your own name.
    • Setting Netscape to save your work automatically every 10 minutes is a good safeguard.
    • If you wish to edit the HTML code or your images with other software, you can browse to find the other programs and set them as your defaults.
    • It is most accurate to see font sizes as relative, since this is the way the Web client determines font size, not in absolute terms.
  3. Double-click on Composer in the list on the left. This will bring up a Publishing option under Composer. Click once on Publishing.
    • Here you have the option to adjust the links in the file and save the images for local editing. These options should be turned OFF if your Web files will include links and images that refer to other directories on the server. For example, if you are using images from the GUide image database (http://data.georgetown.edu/graphics/images/), the option to download the images with the file should be turned off. When this option is turned off, the path to the image you want to insert into your page should be the full, or absolute, URL. Otherwise, Netscape Composer will not be able to locate the image and will supply "?" icons instead.
    • The default site address to publish to if you are working on GUSUN is ftp://gusun.georgetown.edu/home2 OR home3/userid/www/ where home2 is for users with GUSUN IDs that begin with A-L and home3 is for users with GUSUN IDs that begin M-Z. userid is your GUSUN userid. If you are using subdirectories under your www directory, these become an extension of this directory path.
  4. To finish, click on OK. You will then need to completely close down Netscape Navigator and re-start it for these settings to take effect. 
To Create a New File in Netscape Composer
  1. In Netscape Navigator, you can open Composer by selecting the "Composer" option in the Communicator drop-down menu. This will automatically open a blank page. 
  2. Alternatively, you can choose File | New | Blank Page from the drop-down menu in Navigator, or Composer.
  3. Create the file using the Netscape Composer editing tools. Instructions on how to use these tools can be found at http://www.georgetown.edu/uis/web/training/ in the Web training class notes. Additional help can be found using the Help menus in Netscape Composer. Note that response time in this program is a bit slow, especially if you are working on a large file-- be patient. Save your work frequently.
To Edit an Existing File in Netscape Composer
  1. If the file is already on the Web, type in the URL to view the file in Netscape Navigator and then choose File | Edit Page from the drop-down menu. This is also the process you need to use if you wish to use any of the Georgetown templates.
  2. If the file you wish to edit is on a local drive (such as a disk or the C: drive), you can open that file from within Composer. If you are in Navigator, you can open Composer from the Communicator menu.
  3. Make any necessary changes to the file using the Netscape Composer editing tools. Instructions on how to use these tools can be found at http://www.georgetown.edu/uis/web/training/ in the Web training class notes. Additional help can be found using the Help menus in Netscape Composer. Note that response time in this program is a bit slow, especially if you are working on a large file-- be patient. Save your work frequently.
To Publish the File with Netscape Composer
  1. You will need an account on a Web server in order to make your Web files publicly accessible. See "What you will need to begin Web development" above.
  2. When you are done editing the file, save your changes. If you want the file to have a different name on the server than the current name of the file, you should "Save As" and change the file name to the name it will have on the server. 

  3. NOTE: If you want the file to be the default page in the Web directory (i.e. your home page), you need to name it index.html. If you have been editing an index page that you pulled down from the Web, Composer will have changed the original file name from index.html to the name of the directory, so you will have to "Save As" index.html if you want to continue using it as the default page.
  4. Click on the Publish button. In the dialogue box, make sure the filename is the name you want the file to have on the server. If you want to replace an existing file on the server, the file name must be exactly the same as the file name on the server. You can include other files to be published, if these other files belong in the same directory on the server. The default location for publishing files will be supplied in the "Location to publish to" box if you have already set the preferences. The default location on GUSUN is ftp://gusun.georgetown.edu/home2 OR home3/userid/www/ where home2 is for users with last names that begin with A-L and home3 is for users with last names that begin M-Z. userid is your GUSUN userid. If you are using subdirectories under your www directory, these become an extension of this directory path. Type in your GUSUN user name and password. Important: Do not save the password if you are working in a lab or at any publicly accessible computer! Once all this information is correct, click OK to publish the file.
  5. Go back to the Netscape browser (Navigator). Type in the URL for your file to make sure it was uploaded correctly. Your URL on GUSUN is different from the publishing path. Depending on whether you are a faculty member or not, your URL will be http://www.georgetown.edu/faculty OR users/netid/ where netid is your NetID. You may need to reload the file to view the version you just published (click on the Reload or Refresh button). Make sure everything on the page is correct. You should always test your files and all links within those files when you publish Web documents.
  6. It is easy to publish files using Netscape Composer, but although you can publish new files and replace existing files, you cannot create directories or delete files using Composer. To do this you will have to use an FTP program.

Word and WordPerfect

Recent versions of Word and WordPerfect (as well as many other software programs) include features that allow you to create and edit Web files using familiar software strategies in a WYSIWYG environment ("what you see is what you get"). For example, in Word 97 and in WordPerfect 7.0/8.0 for Windows or WordPerfect 3.5 for the Mac, you can simply "Save As" and choose HTML as the file type. (HTML, the Hypertext Markup Language, is the coding that makes Web files work.) 

Although these programs provide an extremely easy way of converting your "legacy" Word and WordPerfect files to publish them on the Web, much of the formatting in the original documents may be lost, and there can be problems in the HTML code that is produced. Specifically, any tabs you have used will vanish, the line spacing can change, and tables may be reformatted. It is a good idea open the converted Word or WordPerfect files in Netscape Composer and continue the editing and publishing process as spelled out in the section above To Edit an Existing File in Netscape Composer. At the very least you should always preview any Word or WordPerfect files you have converted to HTML before publishing them. 

You can also create a new file in Netscape Composer and simply cut and paste text from a Word or WordPerfect document into the new Web file. See the section above To Create a New File in Netscape Composer


HTML Editors - Homesite and BBEdit

HTML is the coding used to create Web files. WYSIWYG programs like Netscape Composer actually create the HTML code for your Web pages, and for most developers there is no need to learn HTML. However, if your WYSIWYG editor does not do everything you want to do, you may need to learn HTML in order to have more control over how your files display and function on the Web. You will also need an HTML editor if you are doing any advanced Web development, such as creating forms or using cascading style sheets. For more information, see the Advanced Web Development and Interactivity section of this Guide. 

HTML Web pages consist of plain text (or ASCII) files with HTML tags that provide the formatting. It is possible to edit HTML files using a plain text editor such as Notepad, which can be found in the "Accessories" folder of Windows. HTML editors, however, are a much more user-friendly way to edit your HTML code. Allaire's Homesite is one of the best HTML editors for Windows, and it is installed in the UIS Computer Labs. Homesite provides fast, easy ways to create and modify HTML files and preview what the resulting Web pages will look like (which is useful given it is not WYSIWYG). If you use a Macintosh, BBEdit is a good HTML editor.

When you are editing an HTML file in Homesite, you can preview how it will look on the Web by selecting Browse. Alternatively, you can save the file and then pull it up to view in Netscape as a local file (under the File menu in Netscape, choose Open Page). Note that if you have just viewed the file in Netscape and then made additional changes, you will need to save the file again and click on the Reload button in Netscape in order to view the latest revisions. 

To learn more about HTML, you can take UIS training classes or view the class notes at http://www.georgetown.edu/uis/web/training/. There are also a number of additional on-line resources available, including: 

For additional help using Homesite, use the Help menu files that are included with the program. If you do not want to use Homesite in the UIS computer labs, you can purchase a copy by contacting the UIS HelpDesk.

Homesite and BBEdit both include an option to validate the HTML. This feature checks the HTML code in your documents and tells you where there are errors in the code. This is particularly useful since something as small as a quote mark that has been omitted can affect the entire page. You should note, however, that not all the errors an HTML validator identifies are critical errors that will affect people's ability to view your page. If you are not using Homesite or BBEdit, there are a number of services available to check the HTML of your Web page after you have published it. W3C offers an HTML Validator service where you can type in any URL to have the HTML code validated for you. 


Link Checking Tools

Unfortunately, developers often move materials on the Web, and then links you have made to those materials will be broken. Therefore it is a good idea to check the links in your Web pages frequently.
Homesite has the capacity to check all the links in your document. A good stand-alone link checker is Linkbot, and there is a limited feature freeware edition, Linkbot Express. The W3C also offers a Link Checker service in which all the links in a page will be checked after you enter the URL of the page. 


FTP Publishing Tools

It is easy to publish your Web pages using Netscape Composer, but you cannot delete files, move files, or create subdirectories using Composer. Therefore, in order to manage the files in your Webspace, you will need an FTP (File Transfer Protocol) program, or some knowledge of UNIX. RapidFiler is an FTP program that is already installed on many desktops at Georgetown. For detailed instructions on using RapidFiler, see the UIS RapidFiler Instructions

Another commonly used FTP program, which is installed in the UIS Computer Labs, is WS FTP. You can get the freeware version, WS_FTP LE, from Softseek. You can submit a 
HelpDesk request to have WS FTP installed on your Georgetown computer. Instructions for using WS FTP c

If you using a Macintosh computer, a good FTP program is Fetch

When using an FTP program, you do NOT have to enter the full publishing path (ftp://gusun.georgetown.edu/home2 OR home3/userid/www/). The "Host Name/Address" you need to enter is gusun.georgetown.edu. Once you enter your GUSUN userid and password, the FTP program will take you to the top level directory of your GUSUN account (unless you have set up the preferences to do otherwise). You will then have to change directories to the www directory before you publish your Web pages. When you are in your www directory, you can create subdirectories, move files, change file names, and remove files. Remember that any changes you make will be reflected in the URLs for those files. See Directory Structure below.


Web Organization and Design Recommendations

Directory Structure and Organization of Files

Before beginning your Web development, you should plan ahead and create a directory structure for your Web files. Your directory structure will affect your URLs and your options for letting other people work on your Web files. 

It's generally a good idea to organize materials in separate subdirectories for different projects. For example, if you are a faculty person, you would want to create separate subdirectories 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. 

Your directory structure becomes part of the URL for the materials. For example, files for a course might have the URL http://www.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://www.georgetown.edu/users/stys/. This also helps protect your directory, because users will not get a directory listing if they type in the URL without the file name. 

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. 


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 (such as has been done with this document). 

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 Netscape is the standard Web client program for most Georgetown University Web users, some users access our site using Lynx or older browsers. This might limit the user's access to some features, such as frames. 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. For more information see the Advanced Web development and Interactivity section of this document. 


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://data.georgetown.edu/graphics/templates/

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 Composer and then modify them by inserting your own text in place of what's there. The Web page you are now reading was created using the Basic Template

There are a number of templates available, but the two most commonly used templates are the Template for 2nd Tier Pages and the Basic Template. These two templates use the standard Georgetown design with the white background. The page width is 603 pixels, the lowest common denominator for the viewing area of small monitors with low resolution, and there are top and bottom navigation bars, which frame the page and provide links to the Georgetown Home Page, A-Z Index, Contents, Directories, and Search. 

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): 

<body text="#000000" bgcolor="#FFFFFF" link="#3333CC" vlink="#CC9900" alink="#336666">

The Template for 2nd Tier Pages is the more complex of the two templates and is recommended for use as the home page for departments, organizations, and administrative units. It consists of two columns, the first with a width of 402 pixels, and the second with a width of 201 pixels. 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. The left (402 pixel) column has room for a small (67x67 pixel) image and then the page title at the top. Underneath there is room for you to insert text or a table of contents with links to the other pages in your site. The right (201 pixel) column contains the targeted audience bars and a "Quick links" dropdown menu with links to the GUide 2nd tier pages. You can edit the contents of the Quick Links menu (the instructions for editing it using Composer are below the links box in the template), but you can display no more than 20 characters, including spaces, in each line in the dropdown box. The right column allows space for inserting images, as long as the images are no wider than 201 pixels. 

The Basic Template is a simpler template with a single column of 603 pixels. Its simple structure makes it 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 is space for a small (67x67 pixel) image and the page title at the top of the page, and after that you can insert anything you wish into the page, so long as the width is not more than 603 pixels. 

An additional template, the Template for 2nd Tier Pages with One Column is a combination of the two templates outlined above. It is has two columns at the top of the page, including the targeted audience bars and a "Quick links" dropdown menu, and one column underneath to give you more flexibility in the page layout. 

Other templates, including the Faculty Home Page and Course templates, are variations of the Basic Template with relevant information added for you to edit. There are also a number of templates available which use the old Georgetown layout with the cream background, but you are encouraged to use the new layout. 


Images and Graphic Elements

Images contribute a great deal to the richness of the Georgetown Web. Images should be relevant to the content of the pages. Consider using the Georgetown Recommended Images and Graphic Elements, as they contribute to the coherence of the Georgetown site. 

However, it is not a good idea to have too many images on a page, because they will slow down the loading speed of the page and can distract from the content. You can speed up the image loading process by specifying the image dimensions in the IMG tag (the default of Composer is to specify the image dimensions). Also, consider using the ALT attribute with images to support visitors who have older browsers or don't want to wait for the graphics. The ALT attribute provides the user with alternative text if they don't see the image. Instructions for using images in Netscape Composer can be found at http://www.georgetown.edu/uis/web/training/ in the Web training class notes.

Georgetown Web developers must abide by copyright laws when using images and graphics elements on the Web. For more information about copyright, see the Copyright section below. 

Georgetown Images and Graphics Elements - The GUide Committee has developed libraries of images and graphic elements that conform to the spatial layout of the recommended templates. These images and graphic elements are mirrored on several of Georgetown's larger Web servers, including data.georgetown.edu/graphics/ and www.georgetown.edu/graphics/

Note that the images directories contain scanned images of places, people, and events from around the University. These images vary in size, but most conform to the template layout in that they are 201 pixels wide, 402 pixels wide, or 67 pixels wide. If you are using any of these images for your pages, you should leave them in their original location. You can do this by inserting them into you page using the full, or absolute, URL (i.e.. http://data.georgetown.edu/graphics/images/image.jpg), rather than simply the image file name. For information on inserting images using Netscape Composer you can take UIS training classes or view the class notes at http://www.georgetown.edu/uis/web/training/

If you create new images, it is recommended that you use the standard widths so your images will fit in the templates. If your images might be useful for others in the Georgetown Web development community, please send your images to the GUide Committee for possible inclusion in the image library. 

Note that the Georgetown homepage image of the rowers is to be used only on the homepage, not on any other Georgetown pages, because this makes the Georgetown homepage unique and easily recognizable as such. 

The elements directories contain graphic elements such as buttons, bars, and dots in blue, gray, and gold colors. The elements directory also includes several versions of the Georgetown seal. Users should note that these and other graphic elements should be used as provided, not altered, since these are part of the graphic identity of the institution. The seal should always be black, gray, or dark blue, and it should never be used in reverse (white on a dark background). If you are using any of these elements for your pages, you should leave them in their original location. You can do this by inserting them into you page using the full, or absolute, URL (i.e.. http://data.georgetown.edu/graphics/elements/image.jpg), rather than simply the element file name. For information on inserting elements using Netscape Composer you can take UIS training classes or view the class notes at http://www.georgetown.edu/uis/web/training/

Other Images and Graphic Elements - If you wish to use your own images or graphic elements in your Web pages, you will have to insert them into your pages using relative paths (i.e. button.gif or images/photo.jpg) and then publish them when you publish your Web page. Some general guidelines extracted from the c|net, Adobe and Tucows Web sites are listed below to help you create Web-friendly images: 

  • The Browser Safe Palette provides the actual palette that Netscape and Internet Explorer use within their browsers, showing actual color examples and their hexadecimal and RGB equivalents by hue or value. The Browser Safe Palette only contains 216 colors out of a possible 256. That is because the remaining 40 colors vary on Macs and PCs. By eliminating the 40 variable colors, this palette is optimized for cross-platform use. 
  • Keep graphics under 10K if possible to facilitate faster image loading. 
  • Windows computers display 96 dots per inch (dpi). Macintosh computers display 72 dpi. So saving your graphics with a resolution greater than 96 dpi is overkill and will just make your files larger and take longer to download. 
  • Graphics should be no wider than 640 pixels. To avoid the reader having to scroll (to see the entire image), keep graphics no taller than 480 pixels. A 10-1/2" x 5-3/8" frame could be used for design purposes. If you are using the Georgetown Templates, your images should be no wider than the template column you are inserting them into. 
  • Continuous-tone images look best saved as JPEG (medium or low quality is all you need) and also give you the smallest file size. If transparency is needed, save as GIF, using an adaptive palette with the fewest number of colors. 
  • Flat-color images (anti-aliased) do well without any dithering, so using an adaptive palette and a dither of none and then saving as GIF will give you the best results with the smallest file size. The number of colors you need will depend on the image - try using the least number possible to get the smallest file. 
  • Black-and-white images need very few colors, so saving them as a GIF lets you select a low number of colors (six colors works well on an anti-aliased image). 
  • Gradations look best with as many colors as possible, so JPEG medium quality is the best option for gradations. JPEG gives a much smaller file size than GIF with an adaptive palette.
There are a number of places at GU which offer scanning and image editing facilities. See the GU Technology page for an overview. Adobe Photoshop is one of the best image software packages available; however, it is fairly expensive. Microsoft Office and Corel WordPerfect Suite 8 both include scaled down image editors. You can also find lists of freeware and shareware image editors from Softseek and Tucows. Remember that before installing anything on a Georgetown computer you should consult the HelpDesk

If you want to create thumbnail images, a useful tool is Firehand Ember. Without creating and loading images into a database or proprietary file format, Firehand Ember quickly creates thumbnail images of all image files in a selected directory, and then allows browsing and managing of those image files. 

If you do not want to use the Georgetown images and graphics elements, or create your own, there are a number of places on the Web where you can get free backgrounds, borders, bullets, fonts, and animations. If you are thinking about using someone else's graphics, however, you need to be careful to comply with copyright laws. Do not assume you can simply use any graphics you find on the Web! Unless a site specifies that you are free to use its graphics for personal use, do not use them. Two places where you can find links to free graphics and images are Tucows and Softseek


Documentation and Meta Data

The Head of every HTML file on the Georgetown Web should have a Title and Meta tags containing bibliographic information. This data will make your pages easier to find with search engines and provide valuable information for your reference and others' reference. The GUide committee recommends the following structure: 

<HEAD>
<TITLE>A Concise Document Title</TITLE>
<META NAME="author" CONTENT="the author's name">
<META NAME="description" CONTENT="a brief description of the web file">
<META NAME="keywords" CONTENT="keywords relevant to the document">
<META NAME="date" CONTENT="Month Date, Year">
<META NAME="revised" CONTENT="Month Date, Year">
<LINK REV="made" HREF="mailto:author@node.georgetown.edu" TITLE="a brief subject line for the e-mail message">
</HEAD>

The "author" Meta tag, along with the "title" tag, provide a bibliographic record of the HTML file. Note that if the person who created the content of the file is not the same person who did the HTML markup for the file, both the "author" and the "creator" should be listed in separate tags. The "description" Meta tag is optional, and should include a one sentence summary of the contents of the HTML file if the "title" is insufficient. The description will be displayed in search engine results pages. The "keywords" Meta tag is helpful to the search engines that will index your HTML file. The "date" tag is used to indicate the date on which the document was created, and the "revised" tag indicates the most recent revision date. Finally, the Link "made" tag will be used by future browsers to provide an e-mail link to the person responsible for handling comments related to the document. Here is an example: 

<HEAD>
<TITLE>Georgetown University Home Page</TITLE>
<META NAME="author" CONTENT="Deborah Everhart">
<META NAME="description" CONTENT="The home page of Georgetown University">
<META NAME="keywords" CONTENT="Georgetown, university, home, undergraduate, graduate, alumni">
<META NAME="date" CONTENT="December 15, 1996">
<META NAME="revised" CONTENT="January 10, 2000">
<LINK REV="made" HREF="mailto:everhart@gusun.georgetown.edu" TITLE="Georgetown University feedback">
</HEAD>

Note that these tags, with the exception of the "made" tag, can be generated in Netscape Composer. To do so, go to the "Format" menu and select "Page Colors and Properties". Then, under the "General" tab, you can fill out the entries for "author," "description," and "keywords." The "date" and "revised" tags then can be created under the "META Tags" tab. 

The Meta tag also may be used to meet certain web development needs: 

<META NAME="language" CONTENT="FRE">

If the Body of the HTML file is in a language other than English, it can be indexed appropriately with the above Meta tag. Ideally, the Content attribute should contain the National Information Standards Organization's three-letter code for the language in question. 

<META HTTP-EQUIV="refresh" CONTENT="n; URL=http://some.web.site">

The above tag is useful for connecting people to an HTML file that has moved recently. If someone loads a file that contains this tag, he or she will be automatically connected to the address indicated for the URL after n seconds. 

<META HTTP-EQUIV="expires" CONTENT="Tue, 30 Aug 1996 13:24:30 GMT">

This tag indicates that the document expires on the indicated date. This is useful for HTML files that frequently change, as this tag instructs the web browser to load a new copy of the file from the server, instead of using the copy in the browser's cache. Note that you must indicate the date in the above format for this tag to function properly. 

See the Dublin Core Metadata page for detailed information on the international standards for providing bibliographic records in Web documents. Note that, for practical purposes, the above GUide recommendations do not entirely conform to the extensive Dublin Core recommendations. 


Copyright

A creative work, be it an e-mail message or a doctoral dissertation, is copyrighted from the moment it is fixed in a tangible medium. No statement or registration is required. Nevertheless, in order to let others know a work is copyrighted and to deter possible infringements, the GUide Committee recommends that the following general copyright statement be applied to top level pages of the Georgetown University Web structure: 

© Copyright 2000, Georgetown University

The entire University Web structure is covered by this statement, and therefore the statement does not need to be included on every Web page. However, if an author of Web pages feels that his or her pages will be widely used by those outside the Georgetown community, we recommend that this or a similar copyright statement be attached. 

Web developers may also wish to make their copyright statements link to the Copyright Information Page, which provides more detailed explanations of what may and may not be done with Georgetown University copyrighted materials. 

Web pages may be copyrighted by Georgetown University, by a department or program within the University, or by an individual, depending on who owns the rights to the materials included in the Web pages. If you have questions about ownership or wish to make changes to the Copyright Information Page to suit particular circumstances regarding your Web pages, contact University Counsel.

As your Web pages change over time, you should extend the copyright date to cover all relevant years, i.e.., © Copyright 1996-2000, Georgetown University. 

All Georgetown University Web developers must respect the copyrights of others. See the Acceptable Use Policy. In addition, more specific concerns apply to teaching at Georgetown University, and all faculty are advised to consult "Copyright Issues in Higher Education: A Guide for Georgetown Faculty." (Note: this document is only accessible from on campus.) 

For more information about copyright in general, consult the following:


Site Administration and Maintenance

Requesting URLs

A subdirectory on a Web server can have more than one URL associated with it through the use of symbolic links. For example, a faculty person might develop conference materials in one of her own subdirectories, but the URL for the conference materials could be under the department sponsoring the conference. To request a subdirectory other than your standard URL under www.georgetown.edu/faculty/ or www.georgetown.edu/users/ on GUSUN, fill out the "symbolic Links" section of the Web services form. The URL you request should be compatible with the general Web structure at Georgetown - i.e. it should be under the relevant sub-directory of the www.georgetown.edu/ stem. 


Creating and Changing Groups

A subdirectory can also be set up so that multiple users in a group have access to the files, for example if several people in a department are working on conference Web files. It is possible to have group rights set up for one subdirectory within your webspace but not others, or to set up different groups with rights to different subdirectories. To request group permissions on the GUSUN Web server, fill out the "Groups" section of the Web services form

Once a group has been set up for a subdirectory, the owner of the subdirectory (i.e. the person in whose GUSUN account the files are located) is responsible for ensuring that the list of people in the group is kept up-to-date. If people in the group are no longer at the university, or no longer working on the files, the owner of the subdirectory needs to fill out the "Changing Groups" section of the Web services form to remove them from the group. 



Statistics of Use

If you would like to know how often your Web pages are visited, you can find out by looking at the statistics on your server. The University-wide convention for storing stats is in a /stats/ directory at the top level under the server URL (e.g., http://www.georgetown.edu/stats/ ). For specific information on how stats on are managed on the www.georgetown.edu server, see the UIS Access Information page.



Restricting Access

Developers should tailor their pages to meet the needs of specific audiences. In some cases, it may be necessary to restrict content to certain locations or individuals. 

Determining the suitability of an audience for a department's files is the responsibility of the Web developer, not the Web Service Provider. Web Service Providers can provide more information on the access restriction options available to developers. If a developer has questions pertaining to the appropriate audience for Web-based materials, the department should contact Financial Affairs, Risk Management, the Registrar (in the case of student information), and/or Internal Audit. 

Domain Name Restrictions - Documents can be restricted based on a domain name (i.e. the *.georgetown.edu or 141.161.* designation restricts access to machines operated on Georgetown University campuses). An example of this type of restriction is the Faculty Copyright Guide, which cannot be accessed from off campus. 

For even narrower restrictions, it is possible to restrict assess to documents based on a particular subnet (ie. the *.dept.georgetown.edu or 141.161.xxx.* designation restricts access to machines operating on a particular subnet). Examples of this type are internal documents for a particular department or administrative unit. If you have documents that should be accessible only to "internal" audiences, we recommend that you put these materials in a subdirectory called "internal" to make it easier for you and your users to remember that these are restricted materials.

Domain name restrictions need to be implemented by the server administrator. Contact Madelon Brennan at brennanm@gunet.georgetown.edu for more information about domain restriction on UIS servers. 

Username/Password Restrictions - Documents can be restricted by username and password authentication. An example of this is the downloading of Georgetown site licensed software by network administrators who must first call UIS to receive the login name and password for the download directory.

Username/password restrictions need to be implemented by the server administrator. Contact Madelon Brennan at brennanm@gunet.georgetown.edu for more information about username/password restrictions on UIS servers. 

Setting File Permissions in UNIX - An additional way of restricting people's access to your Web files is to set the file permissions in UNIX. For the most part, it is preferable to restrict access to your files using either domain name restrictions or passwords, but for some purposes, setting the UNIX file permissions is useful. In UNIX you can restrict access to a particular file to either yourself or a group. This can be useful if there is a file you are working on that you want to publish, but would prefer nobody had access to it until it is finished. In such a case you could temporarily set the UNIX permissions for the file so that nobody except yourself could access it. 

UNIX has a fairly complicated syntax and you should review the general information in the Basic Unix Skills section below. The UNIX command to change file permissions has the following format: 

chmod 777 * or chmod 700 file.html

The First element in this string, "chmod", is the UNIX command. The second element is the 3 digit string that specifies what permissions are being set. The first number is permissions for you, the second is group permissions, and the third is other, or general, permissions. 700 denies everyone except you access to the file, and 777 gives everyone total access (reading, writing and executing) to the file. Finally, the third element in the string specifies the file(s) the permissions are being set for, with * being every file in the directory. For more information on the chmod command see the Webmonkey UNIX Guide information on chmod. 


Transferring Ownership of Files

Sometimes it is necessary to transfer files from one owner to another, such as when a student graduates and leaves behind Web files for a student organization. All Web developers are responsible for transferring their files to another owner or another server before they leave the University. Your service provider is not responsible for files that may be lost when your account is deleted after you leave the University. On GUSUN, developers can request that these files be transferred by filling out the Web services form


Advanced Web Development and Interactivity

The information above will be sufficient for most Web developers. Some people, however, may want to explore Web development in more depth and add more advanced and interactive features to their Web pages. 

Basic UNIX Skills

Most Web servers are UNIX machines, so to have more control over your files and directories on the server, you may need to know UNIX commands. For general information on UNIX, consult the HelpDesk's UNIX information, or the Webmonkey UNIX Guide

You can login to your UNIX account through telnet (connect to gusun.georgetown.edu and you will be in a UNIX environment). Once logged in, you can type in commands at the system prompt. 

A note about PICO: Although it is possible to edit files on the server with PICO, a UNIX text editor, this program inserts unwanted line breaks that can invalidate links in your Web files. If you use PICO on your Web files, you should check them carefully afterwards. 

The UIS HelpDesk has a list of frequently used UNIX commands with explanations of what they do. For example, to create and change permissions on subdirectories within your www directory, you would use the following commands: 

  • cd www - to change the directory to your "www" directory (cd .. will move you back one directory level)
  • mkdir courses - to create a subdirectory called "courses" (You may create any combination of subdirectories within your Web www directory for organizing your materials, but each directory must be world readable in order for the Web files to be accessible.)
  • chmod 705 * - to change permissions and make the new subdirectory world readable (* is shorthand for all files and directories, so this command actually changes permissions on all files and subdirectories in the current working directory). For more information on the chmod command see the Setting File Permissions in UNIX section above.

Dynamic HTML

Dynamic HTML (DHTML) is fairly new technology which allows Web pages to move, animate or respond to the user. It works through a combination of three technologies - Cascading Style sheets, JavaScript, and Document Object Model. Each of these technologies can be used by itself, but when they are used in combination with regular HTML, they form DHTML. Information on each of the three technologies is provided below, but some general references on DHTML include the following: 

You should note that DHTML is a new technology and is therefore only supported by new browsers. Also, there are browser incompatibilities between even the newer versions of Netscape and Internet Explorer. These browsers implement DHTML, particularly DOM, very differently, and support different CSS features. However, both Netscape and Internet Explorer have agreed to support the W3C standards for DHTML, so this should be less of a problem in the future. 

Cascading Style Sheets - Cascading Style Sheets (CSS) are designed to enable developers to have more flexibility by separating the content from the style of their HTML documents. Therefore if you have many files with the same page layout, the style of the page layout can be stored in one file and referenced by the pages that hold the content, so that you don't have to change all of the pages one by one if you want to change the style. CSS is a relatively new technology and therefore does not yet have full browser support. If you are using CSS, you should first consult a browser support table to find out which individual tags are supported by which browser versions. 

For information on how to create CSS, you can take UIS training classes or view the class notes at http://www.georgetown.edu/uis/web/training/.  Additional resources include: 

JavaScript - JavaScript is a scripting language developed by Netscape that is embedded directly into your HTML page, usually in the <HEAD> of the document. JavaScript allows you to add a variety of interactive features to your Web pages, including mouse rollover effects, changing the contents of your pages based on certain conditions, and managing frames and opening them in new windows. 

It is not actually necessary for you to learn to write JavaScript in order to include it in your Web pages. Fortunately, most JavaScript is provided free on the Web, and you can cut and paste it into your HTML page (see http://rummelplatz.uni-mannheim.de/~skoch/js/part1/part1.htm#embed for instructions). Some places where you can find JavaScripts include: 

If you decide you want to learn how to write your own JavaScripts, there are a number of good on-line tutorials which provide general information and help you learn JavaScript, including:  You should note that JavaScript is different from Java Applets, which were developed by Sun Microsystems. Java Applets are self-contained mini-executable programs written in the Java programming language. For more information on Java Applets see Sun Microsystems Applets information and The Java Boutique

Document Object Model - The final element of DHTML is the Document Object Model (DOM). The DOM defines the logical structure of documents and the way they are accessed and manipulated. It allows every element of an HTML file to be referenced by JavaScript or other scripting languages. The main incompatibility between how Netscape and Internet Explorer implement DHTML centers on the differences in how they reference document objects. Netscape uses the <LAYER> tag and IE uses the <STYLE> tag. This can lead to difficulties in using DOM positioning in a non-browser specific way. For more information see the DOM sections of sites listed in the Dynamic HTML section above, and specifically, Aaron Weiss's "The Document Object Model Dissected." For a fairly technical and difficult account of where DOM technology is going, you can also see W3C's DOM recommendations


Frames

Frames are a way of laying out material on a page by dividing a browser window into separate sub-windows which contain different HTML documents. For example, you could use frames to divide a Web page into separate files for the header and footer at the top and bottom of the page, and a column on one side for a table of contents. Frames are a fairly controversial technology amongst Web developers. Although they do have some advantages, they have many disadvantages, including lack of support in old browsers, user difficulties in navigating, bookmarking and printing, search engine incompatibilities, and increases in server load. For more information on the disadvantages and advantages of frames, see Web Tomorrow

UIS does not recommend that you use frames for your Web pages because of the disadvantages associated with them. However, if you are going to use frames, it is advisable that you get as much information on them as possible so you can minimize some of the pitfalls associated with them. There are a number of good tutorials on the use of frames available on the Web, including: 


Audio and Video

You may want to insert audio and video files into your Georgetown Web pages, but you should be aware that these files are very slow for off-campus users. Streamed audio and video files are faster than non-streamed files because they do not have to completely download to the user's computer before they start playing. The time it takes to download non-streamed files depends on the size of the file (which can be very large) and the speed of the modem or Internet connection. Examples of the use of sound and video in Web pages at Georgetown include Catherine Ball's Sounds of the World's Animals, and the Center for Contemporary Arab Studies' video broadcast of King Abdullah of Jordan's speech

NOTE: Audio and video files are covered by copyright laws, so you need to be extremely careful about using anyone else's files. You must not use others' materials without explicit permission from the copyright holder. See the Copyright section of this document for more information. 

Inserting audio and video files into your Web page involves two steps. First, you need to digitally encode and compress the file using codec software such as QuickTime or RealProducer. A fuller list of codecs can be found at Codec Central. Different codec software will produce different formats and sizes of files. For example, RealProducer produces .ram (audio) and .rm (video) files which are streamed formats with a high compression. QuickTime produces dozens of different streamed and non-streamed file formats with varying degrees of compression (see the Quicktime information on Compressors for more information). Choosing which codec and file format to use is critical to the size of your file and its downloading time. 

Once you have your audio or video file compressed to the smallest possible size, you then need to insert it into you Web page. You can do this using either a simple link, or using the <EMBED> tag. See Web Spider's Audio and Video Instructions for more information on inserting audio and video files into your Web pages. 

For more information on audio and video files into your Web pages, see: 


Online Forms and Scripts

Adding interactive features to your Web pages can make them more dynamic and functional. It is possible to include online forms in your pages by using the standard Perl scripts that are available for anyone at Georgetown to use. These scripts reside in the cgi-bin of the GUSUN server, and you can use them to run forms and other interactive features on your Web pages. The following scripts are available; click on the link for detailed documentation of the HTML code you need to use:

  • Discussion Forum: create an interactive discussion forum on your web page
  • Feedback: put a simple feedback form on your web page
  • FormMail: create forms and questionnaires for visitors to fill out
  • Links Menu: list links to many sites in a compact, drop-down menu
  • Imagemap: provide multiple links from a single image
You do not need to know Perl to use these scripts, but you will need to know how to create forms in HTML. For more information on forms and acripts, see the WWW5 Class Notes.

Experimental Web Development on Epsilon3

You are free to use the standard Perl scripts (above) on GUSUN, but you cannot alter them. If you want to develop your own scripts and tools using Perl, Java, C, or C++, you can do so on the experimental Web server, Epsilon3. Epsilon3 is a server where students, faculty, and staff can develop their own Web resources, but without placing at risk the stability or security of Georgetown's primary Web servers. 

Perl 5.0 and version 1.1 of Sun's Java Development Kit are available to Web developers on Epsilon3. Also, users are able to execute Perl scripts from within their directories, and can use other command-line functions that are typically unavailable to users on other Georgetown systems. For more information, go to the Epsilon3 General Information Page. To apply for an Epsilon3 account, go to the on-line application form


Cold Fusion Development

Cold Fusion is a program you can use to manipulate Microsoft Access databases via Web pages. Cold Fusion allows users to insert information into or retrieve information from a database using Cold Fusion templates. This allows for the generation of Web pages using live data. Georgetown has a Windows NT server, DATA, devoted to Cold Fusion development, http://data.georgetown.edu/. For more information see the Windows NT Web Development Information page

Developers should thoroughly read the on-line documentation available for Cold Fusion and have a firm grasp of SQL (Structured Query Language) before attempting to create interactive projects on the DATA server. UIS will provide initial consultation about your project and basic support for Cold Fusion questions that may arise, but we do not have the resources to develop projects for you or to review your SQL commands and Cold Fusion markup. It is also recommended that you take the Cold Fusion training class


Further Resources and References

Georgetown Resources: 

Other Resources: 

Conclusion

This guide is intended to give you the information you need for becoming a Web developer. Revisit these pages as you become more skilled in Web development, because we will periodically revise this guide to keep it up-to-date. If you have specific questions about Web development and the software supported in your area of the University, contact your service provider



We welcome your comments and suggestions for improvements to this guide. You may send e-mail to brennanm@georgetown.edu or call 687-8041.
 

© Copyright 1995-2000, Georgetown University
 
 Georgetown University Home | A-Z Index Contents Directories Search