How to Create CNE Tutorial Modules

The tutorial modules of the Center for the New Engineer stress ease of navigation and graphic content. The primary mode of navigation is the subway map. The secondary mode is graphic buttons. This document contains useful information and links to guides for the developer of CNE Tutorial Modules.

• Learning HTML
• Gary's Guide to Graphics

The following are a list of the tools we use here at CNE to create the Tutorial Module Pages.

HTML Editors

CNE Web Publisher

The CNE Web Publisher is an HTML editor designed specifically for creating modules with the subway map format used by CNE. Webpub is a full-featured text editor, an HTML editor, and contains single-click access for standard images used by the CNE modules. Developers of CNE modules are strongly encouraged to use this editor when creating their modules. The CNE Web Publisher is located at: /share/local4/info/www/modules/CNE_WEB_PUBLISHER. In order to be able to execute it from anywhere in your account you will need to add the following path in your .cshrc file:

set path = ( $path /share/local/info/www/modules/CNE_WEB_PUBLISHER )

then you may execute the publisher by the command:

webpub -bg gray

Send your comments about the CNE Web Publisher to: vpatil@cne.gmu.edu

SoftQuad HoTMetaL

HoTMetaL is an HTML editor. One of the nice things about this editor is that you don't have to memorize HTML tags. All the HTML tags are available from a list. Double-clicking on an item on this list puts that tag in your document. HoTMetaL also generates "legal" HTML which conforms to HTML 1.0 standards -- it's guaranteed to work on browsers such as Mosaic and Netscape.

Image and Imagemap Tools

CorelDRAW

CorelDRAW is a powerful graphics illustration package for Microsoft Windows. It is easy to create vector objects such as rectangles, circles, lines, etc. It also has nice features like gradient, bitmap and fractal fills, and so on. You will find it on the WIN PC. After you create your image, use the export command in CorelDRAW to convert the image to .gif format. You can then ftp the image to the directory where you wish to keep it.

MapEdit

MapEdit allows you to create "clickable-images" or imagemaps. With MapEdit, you can assign links to regions of an image (hotspots). You will need this tool to create the hotspots in your subway map.

Giftool

Giftool allows you to create "interlaced" images which appear to "fade-in" when loaded using a browser such as Netscape. It also allows you to create "transparent" images, so that the page background is the same as your image background.