_________________________________________________________________
   
                   THE REALLY EASY GUIDE TO WWW/MOSAIC/HTML
                                       
   [IMAGE]
     _________________________________________________________________
   
Goal:

   To teach people who know nothing about HTML to create beautiful
   documents for the World Wide Web.
     _________________________________________________________________
   
Contents

   1) What is the World Wide Web?
   
   2) What are hypertext and hypermedia?
   
   3) What is Mosaic and what is HTML?
   
   4) What text editors should I use to write HTML files?
   
   5) What is a URL?
   
   6) Writing HTML files
   
   7) Using IMGSNAP to capture images on screen
   
   8) Using Xview to modify images and image formats
   
   9) Using "assemble" to paste images together
   
   
     _________________________________________________________________
   
1) What is the World Wide Web?

   The World Wide Web (WWW) is basically a collection of servers all over
   the world that can provide information to anybody connected to the
   web. For example, if one writes a program for the Web describing
   his/her research, all of a sudden, vast numbers of people have
   instantaneous access to it. When using the web, you can click on any
   underligned text or outlined image to get more information on that
   topic. You don't really need to know more at this time, but click
   here for more information if you want it.
   
   
     _________________________________________________________________
   
2) What are hypertext and hypermedia?

   Hypertext is text that you can click on. Hypertext has a built in link
   to some other document (or some other part of the same document). When
   you click on hypertext, the link will be invoked and the other
   document will be immediately called on screen. Hypermedia is just a
   more general term for the same concept as hypertext. Hypermedia
   implies that one can click on images as well to invoke some other
   document (or some other image, or a movie, or a sound). The purpose of
   hypermedia is to facilitate information access. Now, one simply has to
   click a button to get more information on a particular topic.
     _________________________________________________________________
   
3) What is Mosaic and what is HTML?

   Documents written for the Web must be written in a language. This
   language is called HTML and stands for HyperText Markup Language. So
   when one writes a document for the Web, one is creating an HTML file.
   
   A BROWSER is the tool that gives the user access to the web. A Browser
   connects one to the web, reads HTML files and converts them into the
   nice display you're looking at right now. A browser also handles all
   the file transfers that hypermedia requires. MOSAIC IS A BROWSER, but
   there are many others.
     _________________________________________________________________
   
4) What text editors should I use to write HTML files?

   SoftQuad HoTMetaL is a really neat editor designed specifically for
   HTML. It's got great pull down windows to insert markers etc.
   Unfortunately, it only runs on Suns. Emacs has a reasonably good HTML
   mode. (Some versions of emacs do not have an HTML mode). Use emacs.
   
   In an emacs window save a file as "----.html". Now the mode line
   should indicate that you are in emacs HTML mode. Now enter Control-h,
   m. This will give you help on the html mode, more specifically, it
   will give you shortcuts to entering the markers that HTML requires.
   You may find a hardcopy of this help screen useful.
     _________________________________________________________________
   
5) What is a URL?

   URL stands for Uniform Resource Locator. When a hyperlink is invoked,
   Mosaic needs to know the location (address, path, and filename) of the
   document that is being called. This "location" is specified in a
   standard format known as a URL. The URL can be in a format specifying
   either a file on the local system, a file on a WWW server, a file on a
   Gopher server, or a file on a WAIS server. HTTP stands for hypertext
   transfer protocol, and is the mechanism used to access files on
   various WWW servers. Click here for more information.
     _________________________________________________________________
   
6) Writing HTML files

   If you know nothing about HTML, the first thing to do is go through an
   excellent tutorial. It's easy, and does not take a long time. It's
   best if you actually work through the examples they present. Click
   here for an excellent tutorial.
   
   Once you are through the tutorial, you know more than enough to start.
   However, you can read the following HTML documentation, but it's
   probably not necessary at this point.
     * A Beginner's Guide to HTML
     * HTML Primer
     * HTML Quick Reference
     * How to Write HTML Files
     * Composing Good HTML
     * Style Guide for Online Hypertext
       
   The basic thing to remember is that anything in a an HTML document
   that is not plain text is surrounded by markers. (Plain text is not
   surrounded by markers.) So anything special one wants to do must use a
   marker of some kind. Most basic markers are detailed in the excellent
   tutorial above. Here are summaries of some basic things that one may
   use frequently:
   
   Linking to another document or to another place in the same document:
   
   
   To create a hyperlink to jump elsewhere, one must identify the
   hypertext and the hyperlink in the following manner:

<A HREF="file#destination">[text to click on]</A>

   The [text to click on] IS THE HYPERTEXT and will be underlined when
   the document is read by Mosaic. The file#destination is the place
   Mosaic will jump to (see below) when the hypertext is clicked upon.
   
   The following statement must be placed at the spot where one wants
   Mosaic to jump to:

<A NAME="Destination">[text to jump to]</A>

   Note that this position was given a name Destination which was
   referenced in the hyperlink above. The [text to jump to] can be
   omitted.
   
   When using filenames, it is always better and faster to use relative
   references than absolute references. For example, if the reference is
   to a document in the same directory, simply the filename must be
   specified.
   
   If the link is to the beginning of another document, than the
   Destination need not be specified, and the link is simply:

<A HREF="file">[text to click on]</A>

   If the link is to another part of the same document, then the filename
   need not be specified, but the Destination must me specified. The link
   becomes:

<A HREF="#destination">[text to click on]</A>

   With the destination statement as:

<A NAME="Destination">[text to jump to]</A>

   
   
   Inserting images:
   
   Images must be in gif format (----.gif). Creating gif formats from
   other formats is dealt with in Section XXX (XXXXXXXXXX). To insert an
   image, include the statement:

<IMG ALIGN=TOP SRC="----.gif">

   where the image is to be placed. Note that ALIGN=TOP is optional and
   the default is bottom. This means that text next to the image will
   either be at the top or bottom of the image.
   
   Linking to an image from hypertext:
   
   In this case, an image will pop up when the hypertext is clicked upon.
   Use:

<A HREF="----.gif">[text to click on]</A>



   Linking to an image from another image:
   
   Use the following statement:

<A HREF="----.gif"><IMG ALIGN=TOP SRC="----.gif">
</A>

   Note that the image preceeded by HREF will pop up when the other image
   is clicked upon.
   
   Linking to a film:
   
   Films must be in mpeg format (----.mpg). Use:

<A HREF="----.mpg"><IMG ALIGN=TOP SRC="----.gif">
</A>

   Note that in this case, the hypermedia is as image. Clicking on the
   image will call up the film. If the image is replaced with text, then
   clicking on the text will call up the movie. For example:

<A HREF="----.mpg">Click here for film.
</A>

   
     _________________________________________________________________
   
7) Using IMGSNAP to capture images on screen

   Any arbitrary section of the screen can be captured using IMGSNAP.
   Type "imgsnap" in any Xterm and specify whether the whole screen or
   just a part of the screen is to be captured. Note that there is a
   "vanish while saving" option that will remove the imgsnap control
   window while the screen is being saved. If only a portion of the
   screen is to be saved, turn on "grab selection focus" and outline the
   area to be saved using the mouse and the left button. Once the area
   has been outlined, each border can be moved. Place the cursor on the
   border to be moved and note the arrows that appear. Now, hold down the
   left button, and move the border. When the area to be grabbed is
   satisfactory, turn off "grab selection focus". Now specify a filename
   (make sure you specify the path you want), and save...that's it!!!
   Dont worry about the file format, that will be taken care of later
   using Xview.
     _________________________________________________________________
   
8) Using Xview to modify images and image formats

   Often, saved images are not an optimal size for an HTML document.
   Almost always, they are not in the correct file format. Xview can
   solve these problems.
   
   Go to the directory where the images to be modified are. Type xv. Now
   an xv window pops up. Click the right button on the window, and
   another windon should pop up. Now click on "visual schnauser", and a
   third window should pop up. Double click on any image file in this
   third window, and shortly, the image should appear on screen. Now, the
   size of the image can be manipulated by clicking on "set size" in the
   control panel. Enter the new dimensions or the percentage change. Note
   the change in image size. This new image can now be saved. Click on
   save; MAKE SURE TO SPECIFY GIF FORMAT AS HTML DOCUMENTS REQUIRE GIF
   FILES; specify the appropriate path and filename, and save. Note that
   the image size need not be changed to save the file to a different
   format. That's it!!!
   
   A small version of an image may be included in a document with a
   hyperlink to the actual larger image. This improves loading time, and
   is less cluttersome on the Mosaic screeen. Also, it's pretty fun to
   click on an image to get a larger version of the image.
     _________________________________________________________________
   
9) Using "assemble" to paste images together

   Often, one will want to paste images together. The uxix "assemble"
   command allows the assembly of rgb image files. (Note that any image
   file can be converted into an rgb file via Xview. When saving, just
   choose the IRIX format, as rgb and IRIX are equivalent.)
   
   Typing "man assemble" yields: "assemble" assembles an nx by ny array
   of smaller images. The catch here is that all images being assembled
   have to have the same x/y dimensions. The nx by ny array works like
   this: nx is the number of images that are going to be sitting side by
   side in the horizontal direction, and ny is the number of images side
   by side in the vertical direction. Order imgfiles so that the first
   image will be the one sitting in the bottom left-hand corner of
   outimage, with the second sitting either above it or to its right. If
   fewer than nx times ny images are given on the command line, the last
   image is used repeatedly. The format for the command is:
   
   assemble nx ny outimage imgfiles...
   
   So, the command:

assemble 2 2 comp.rgb a.rgb b.rgb c.rgb d.rgb

   will yield a composite image called comp.rgb which is a composite of
   imabes a.rgb, b.rgb, c.rgb, and d.rgb. Now the resulting rgb file can
   be converted to a gif file with Xview.
     _________________________________________________________________