Next: Tips and techniques Up: Image maps Previous: Specifying an image

Button bars: an image map application

A common use for image maps is to provide a button bar. This is generally a strip across the screen containing stylized images of buttons, which can be clicked on to select various documents or resources. Many organizations use button bars as a method of navigation around their documents. For example, Silicon Graphics' home page includes the button bar shown below:

The button bar is set up as an image map linked to http://www.sgi.com/cgi-bin/imagemap/SGIbar-map, which refers to an image map file for the NCSA imagemap program. The following example shows an image map file for this button bar:

    # Button bar for Silicon Graphics Home Page

    rect http://www.ai.mit.edu/stocks/graph?SGI         0,0   127,44
    rect http://www.sgi.com/whats_new.html              128,0 239,44
    rect http://www.ncsa.uiuc.edu/SDG/Software/Mosaic/  240,0 369,44
    rect http://www.sgi.com/subsidiaries.html           370,0 532,44

To set up an image map like this you need to know the dimensions of the image and then divide the image into rectangular buttons. The coordinates of the rectangles should be set so that the whole of the button bar is covered. Each rectangle is associated with a separate URL. You can create the images for button bars using interactive graphics programs.

Spinning the Web by Andrew Ford
© 1995 International Thomson Publishing
© 2002 Andrew Ford and Ford & Mason Ltd
Note: this HTML document was generated in December 1994 directly from the LaTeX source files using LaTeX2HTML. It was formatted into our standard page layout using the Template Toolkit. The document is mainly of historical interest as obviously many of the sites mentioned have long since disappeared.