Imagemaps, Commond Gateway Interface, Access Statistics

Imagemaps

Implementing an imagemap involves three steps:

1. Prepare an image to be used with the imagemap capability. (All of the pointers we discussed regarding images still apply. Remember that once the image must be viewed in order to navigate further, people with slow connections have no choice but to retrieve the image.)
2. Make a file specifying the areas within your image that if clicked should link to somewhere else. This is called the map file. Creating this file represents most of the work. The image is described by an x-y coordinate system for the pixels within the image with the coordinate 1,1 located in the upper left hand corner. Different geometric shapes can be used to specify the regions:
   • rectangle:
     rect <URL> <upper left coordinate> <lower right coordinate> .
     For example,
     rect /people/faculty/mcduff/link1.html 1,1 30,30
     specifies a rectangle with its upper left coordinate at 1,1 and it lower right corner at 30,30. When a point within this rectangle is clicked a link will be made to my file link1.html

   • circle:
     circle <URL> <center> <any point on edge>

   • polygon:
     poly <URL> <vertex 1> <vertex 2> <vertex 3>...., up to 100 vertices

   • closest point:
     point <URL> <coordinate>

   • while not a shape there is also a default action which can be specified which provides a link for any area not defined in the maps file:
default <URL>

   Whether the location of a click matches one of the specified regions is determined in the order the instructions appear in the map file, so that if there are overlapping regions, the one earliest in the file takes precedence.

   The map file can of course be prepared manually, but there are also programs to help with construction of a map file. I use a shareware program called mapedit.

   ---

   demo of mapedit to build a map file for

   ---

3. Incorporate the imagemap into your web page. An example of the syntax is

   
   <a href=http://www.ocean.washington.edu/cgi-bin/imagemap/people/faculty/
   mcduff/example.map>
   <img src=/people/faculty/mcduff/example.gif ismap></a>.

   The anchor reference consists of two parts. The first part,
   href=http://www.ocean.washington.edu/cgi-bin/imagemap/
   specifies the location of the imagemap program on tsunami. The second part /people/faculty/mcduff/example.map specifies the location of the map file within the document tree. The image itself specified by the <img> tag is made clickable by including the ismap attribute. This attribute means:

   If ismap is present and the image tag is within an anchor, the image will become a "clickable image". The pixel coordinates of the cursor will be appended to the URL specified in the anchor if the user clicks within the ismap image. The resulting URL will take the form "URL?m,n" where m and n are integer coordinates, and the URL will specify the location of a program that will examine the pixel coordinates, and return an appropriate document.

Common Gateway Interface

The HTML form tag is the other common document markup that makes use of CGI. The reader of a document provides input and the document returned will reflect that input.

Extensive information is available on writing cgi programs. The details are probably beyond the scope of this class, but we could schedule a special session if some subset of you are interested in learning more.

Access Statistics

portage.ocean.washington.edu - - [20/May/1996:12:40:09 -0700] "GET /ots/es/logo3.gif HTTP/1.0" 200 2392

It shows the machine from which the connection came, the date and time, the particular http request that was fulfilled (generally these are the command GET), the particular file that was delivered, the protocol used, a status code (200 means okay) and the number of bytes transferred.

Note that a single page may require multiple GET instructions over the connections, to retrieve the source for a document and each of the in-line graphics files that it includes.

To summarize statistics I use the program wwwstat which is installed in /usr/local/bin on tsunami. There are many options for using the program which can be found with the command
wwwstat -h
Because of the size of the log files wwwstat puts a heavy load on tsunami and should only be run at night. But because it is automatically run, you may not need to run it yourself unless you have a special requirement. We can link to the latest log to examine the nature of the summary that is generated.