Using an Imagemap on a Web Page
Note: As of April 1st, 2008 personal homepages are no longer supported
An imagemap allows the user to include a graphical image in their HTML documents and map that image with links that lead to other HTML documents.
You should review the NCSA tutorial on imagemapping to get more detailed information on how to create an imagemap but here's a summary of setting up an imagemap.
- Create the image
You first need to create your image and then include that image in your html directory following the filenaming conventions for the type of image that you produce.
- Determine the areas of the image that will link to other HTML documents
You then need to determine the coordinates of the areas of your image which will be mapped to link to other documents and you need the URL's for those documents. These areas are defined as x and y coordinates and there are various software that can help you in mapping these coordinates. A search at a site like http://www.shareware.com can allow you to ftp these software packages.
- Create the map file
All of this information is stored in an imagemap map file that is also stored in your html directory and the filename must end with the suffix .map. Look at our sample map file.
- Set the permissions of the files
Now you must make all the files in your html directory available to the world. To do this you must change the permission mode of the files. Use the following commands to do this:
chmod 644 ~
chmod 644 ~/html
chmod 644 ~/html/*
- Reference the imagemap in your HTML document
Once you've created your image and the map that defines areas of the image that will link to other HTML documents, you can include your imagemap in your HTML document in one of two ways:
- as a magic mime type
This method of having the server treat your imagemap as a mime type loads the image faster. The mime type has been defined on Dolphin so you would only need to reference your map file in your HTML document. We would strongly recommend that you use this method.
<A HREF="/~formuser/home.map"> <IMG SRC="/~formuser/homepage.gif" ALT="" ISMAP></a>
- as an argument to a CGI script
For backward compatibility, you may also reference your imagemap as an argument to a CGI script. The location of the imagemap CGI script on Dolphin is /cgi-bin/imagemap.
<A HREF="/cgi-bin/imagemap/~formuser/home.map"> <IMG SRC="/~formuser/homepage.gif" ALT="" ISMAP></a>
You can also opt to include your imagemap as a client side imagemap but you must have the appropiate browser installed on your workstation. See Netscape's instructions for creating a client side imagemap or instructions for some selected browsers.
Please note: This material is no longer current and appears
online for archival purposes only.
Use the search and navigation tools above to locate more up-to-date materials, if they exist.
Information Systems and Computing, University of Pennsylvania