Carina's Blog

Image Map Basics

When trying to find information and examples related to Image Maps as an aspect of Online Journalism, it was quite hard to determine what exactly Image Maps are (and what they are not) – where does the simple image map end and the clickable interactive start, for example?

To a certain extent, most image maps are clickable interactives, but not all clickable interactives are image maps (they could be narrated slideshows for example).
In terms of a very basic technical definition, image maps are generated by applying so-called hotspots on a certain image (which involves assigning coordinates to the image area you want to link from) and allowing to generate new content (a pop-up, opening a new site or frame) related to the area of the image clicked. You can find a short introduction to simple image map construction on this site, or alternatively work through Dreamweaver.

A very basic example to illustrate the original purpose of image maps for navigation – as a visual menu to link within a website – is used at Totalnews. Similar to that, NewsVoyager uses the image map of the US to link through to an extended menu of the specific local newspapers, rather than a list of the US States.

Online Journalism uses this technique in a different way – images not to link to different content, but to generate additional information about the topic related to the image - an example of which is this map of Iraq illustrating the locations of journalists in Iraq in 2003. When clicking on the figure symbols, a list of journalists working in that area is generated.

Another example of using image maps for adding information to an online visual, is this Iraq map that provides facts and figures about the chosen (clicked) area of the map.

I hope this explains the origins and basics of image maps – more on different types of image maps, the pros and cons and the general philosophy of image maps in the next post…

posted by Carina @ 3:46 pm