Quick Checklist: Imagemaps at UWM

We use NCSA style imagemaps with our WWW server, and you can use server side imagemaps in your pages by following a few simple steps.

Create or obtain (watch those copyrights!) an image.
We suggest using a .gif format image file, since not all browsers handle other image formats, especially as a mapped image. You can usually convert files to .gif format with one of the many image/paint tools.
Put the image file in your web area.
Copy, transfer, or FTP ( binary mode please!) the image into your Alpha "www" directory. Make sure that the image is world readable (the "mkpub" command will do this), and make sure that the image does NOT have execute permissions set.
Create a map file to go with your image.
You may use a text editor or one of the interactive graphical imagemap tools to create the actual imagemap file. Make sure that you use complete path URLs in the map file, not relative ones. For example, where you would use "blah.html" in HTML, you need to use "/~yourlogin/blah.html" in your map file. (Replace yourlogin with your Alpha login id, etc.)
Put the map file in your web area.
Copy, transfer, or FTP (do NOT use binary mode for this file!) the map file into your Alpha "www" directory. The map file should have a filename ending in .map to indentify it's format. Make sure that the file is world readable (the "mkpub" command will do this).

If you have problems later, look at this .map file in the editor or with the "more" command. All of the imagemap lines should be on separate lines in the file. If it all "runs together" then you've run into the problem of not transferring in "TEXT" mode: Unix and PC/Macs use different line termination characters, and if the transfer doesn't take this into account, all the lines in a file become one long line, which doesn't work.
Create an HTML file to "call" your imagemap.
Using whatever method you prefer for creating HTML files, create a file that "calls" your imagemap. The HTML mark-up to do this will look like this:

<A HREF="/cgi-bin/imagemap/~yourlogin/your.map">
<IMG SRC="your.gif" ALT="" ISMAP></A>

(Replace yourlogin with your Alpha login id, etc.)

Or, for Departmental pages:

<A HREF="/cgi-bin/imagemap/Dept/yourdept/your.map">
<IMG SRC="your.gif" ALT="" ISMAP></A>

(Replace yourdept with your Departmental WWW directory, etc.)

Again, put the .html file in your web area and make sure it's world readable.

You should now have a working map file. Make sure that you remember to duplicate your imagemap links in another from for users without graphics and search engines. Also, consider if imagemaps are even required for what you're trying to do. The "UWM Comment Search ..." buttons at the bottom of this page are done as simply separate images, each with it's own link, side by side.

More Information

For more information about building and using imagemaps:

NCSA Guide to Imagemaps
Image Map Help Page
Includes all sorts of information, including Client Side Imagemaps...
Justin Dyson's Image Map Guide

There are programs which help you interactively build imagemaps:

Last update: July 5, 2000. --- URL: http://www.uwm.edu/info/imapquick.html
Copyright 2000 by the University of Wisconsin-Milwaukee, all rights reserved.
If you have questions or comments about this page please send e-mail to: www@uwm.edu