Creating an Interactive image

An interactive image (also called a image map) is an image with clickable areas. It can used to literally create clickable maps or pictures with areas you can click to move to other images or have pop up information.

NOTE: For information on how the Local History Database was created and structured see separate article – click here

WordPress has a plugin called Draw Attention that allows you do this. (https://wpdrawattention.com/). There is a good video explaining how to create an image map (https://wpdrawattention.com/document/create-your-first-draw-attention-image/) and also some demos of different uses (https://wpdrawattention.com/showcase/)

Adding the map

Adding the map to the page was tricky because I think you need the pro version for the basic features they show in the video. It was quite easy once I knew. You just add a Short Code to the page and enter

where 512 is the number of the map. You can get this number if you look at the perm link in the Draw attention screen

Creating the Guildford Master Map

I wanted a master map to allow people to search for articles on places by area. The hardest part of the process was choosing the areas. I decided to be driven by my knowledge of the town rather than by any official boundaries.

One important consideration was the number of results a browser would get. I want this site to feel simple even if it ends up with a lot of articles. Hence when someone clicks on an area they should not see lots of results. So the size of the areas was an important consideration. For the town centre this might mean that the visitor is taken to another map which is broken down further.

Another consideration was roads. I decided that roads should not be a boundary as this would lead to confusion because buildings on one side would be in one area and buildings on the other would be in another area. Of course there are obvious exceptions. If a road has a park one side then the road could be on the edge of an area. e.g Nightingale Road.

I found that railways or rivers were much better demarcation lines because then tend to split areas up and the areas either side are often distinctive. So In Guildford Burpham and Merrow are sort of separated by the railway. I am sure there are some people on Burpham side of railway who would say they are in Merrow but generally it works.

The hardest consideration was where the town centre starts and finishes. Everyone’s idea of the town centre will be different. I just chose an area that made sense bordered by the river in some cases or a park in others. Where housing on the centre of the town ran continuously into the suburbs this was harder. I just make a decision (in my case based on the extent of the town in 1900 approximately) but the great thing about the image map is that the map itself shows the areas under consideration

Finally, naming the areas was a problem. For convenience each highlighted area on the map needed a short name but in practice the area covered several areas. Since these names are only going to be used by me for cataloguing I chose names that made sense to me. e.g Stoughton is roughly north east of the town, Burpham covers a distinctive area to the north-west.