Introduction to Image Maps and Flash Image Maps
Introduction to Image Maps and Flash Image Maps
An image map is usually a photo, a diagram, or a chart, with single or multiple hot spots which are clickable. Clicking on the hot spots will let browsers see more information in a pop-up information box, or redirect to another related web page.
Image maps allow web designers to be more creative in terms of visual effects and website navigation. For example, if you are organizing a trade show or exhibition, you can use an image map to display your exhibition floor plan, and allow browsers to see each exhibitor’s details by hover over their mouse pointer on a booth, a logo or a descriptive text, with a link to the home page of the selected exhibitor. If you are in the business of selling furniture, you could put a large image of a fully furnished apartment on your home page. By rolling the cursor over certain objects, such as the sofa, users will find
that they can actually click on the sofa and it will take them to the related page where they can find a collection of sofas for them to find more information easily.
Image maps make information on your website more easy to access, which encourage customers to keep coming back to your page and can improve your website’s conversion ratio. When people browsing information online, they often respond to visual and interactive elements faster. Image maps helps visitors to find information as they do not need to read lots of text in order to find the page they want. Instead, they look at a self-explanatory image, and click on the item or element which interested them the most. This in turn makes it easier to convert visitors into prospective customers or serious buyers.
How do you turn an image into an image map? Traditionally, image maps are coded using Javascript,
HTML, CSS, and hot spots are defined by using x and y coordinates. Experienced web designers are able to make an image maps by hand, using a simple text editor such as NotePad, however doing so requires that the web developer knows HTML coding and also requires them to know the coordinates of the areas that they wish to place over the image. As a result, most image maps coded by hand are simple polygons and not very useful for business owners who often do not have advance coding knowledge.
Creating image maps in a text editor requires time and effort, there are many applications that allow the web designer to quickly and easily create image maps. One example of these is Dreamweaver which is a commercial software from Adobe Inc., it is a web page editor with built-in image map tools.
In recent years, more and more web developers are using Flash to create image
maps, instead of HTML and CSS. Creating image maps using Flash is a lot easier, faster, and more powerful. That’s because Flash maps have a wide variety of interactive functions to enable different rollover effects, various pop-up box styles, and zooming. Flash image maps also loads a lot smoother and faster, with better browser compatibility because browsers of all types use the same Flash plug-in from Adobe. Whereas HTML image map might work differently in old and new browser, and the mapping script often won’t work across browsers of all operation system platforms.
Different from HTML image maps, flash image maps combine image and script into a single file, which makes it straightforward for web developers to embed into their existing web page without worry about affecting existing scripts. In addition, there are many flash image map software available online which
you can find by searching on Google. These software can easily convert your JPG or PNG images into a clickable interactive map with custom defined hot spots, and best of all you can use these software to create interactive maps without any HTML coding or scripting knowledge.
Godfrey Ko, website developer and software author since 1996. Some of his software creations including a online Flash Video Player, and Interactive Map Builder.
Article from articlesbase.com
