Image Maps

Image Maps

They are used to add multiple links to a single image, in which each link points to a different resource. They are used if the image is to be divided in specific shapes also called as maps where each of these clickable areas is called hotspot.

Hotspots should not be too small else users would have difficulty in selecting them. Image maps can also be difficult for people with impairments.

Image maps are defined by x and y coordinates, measured from the top left-hand corner of the image. These coordinates are used in two ways:

• Outline the hotspots
• Map where the user is clicking on the image.

By comparing the coordinates of the hotspots with the coordinates where the user clicks, the user can be sent to the link specified for that hotspot. There are two types of image maps, depending upon who is computing the hotspot which is clicked on.

Client-side image maps Web browser computes which part of image has been clicked and directs to the appropriate page. Image map tells how the image has been divided and the link to be taken to on clicking. It is created with the usemap attribute for the <img> tag, along with corresponding <map> and <area> tags. It makes for easy access as browser doesn’t have to look for the information elsewhere.

Server-side image maps – Server does the computation as web browser sends coordinates to the server, and server determines which page should be directed to. It is enabled by the ismap attribute for the <img> tag and requires access to a server and related image-map processing applications.