Mapped or Sliced Image?
These are 2 different methods for
adding links to areas of an image.
Mapped image
An image, either large or small, can have
certain areas selected using a tool which creates shapes. The area
within the shape can then be linked to a page, document etc.
This is useful for adding hyperlinked information referring to an object or
hot spot area of your original image.
Most programs will also optimize the original image for uploading.
The
physical size of the image will not normally be changed, even though the
digital "weight" (number of pixels) might be.
Experiment with the
CoffeeCup Image Mapper for mapped images.
W3C on image maps
http://www.w3.org/TR/html4/struct/objects.html#h-13.6
Sliced images
As I mentioned before, slicing images is another way to use areas of an image as links to other documents, pages or images.
To slice up an image you will need a
program to elaborate images. Most programs will have some tool or another to slice up your image, so quite probably whatever you use normally will be more than adequate.
Look at this image to see more or less what needs to be done:
http://www.venicedigital.com/coffeecup/forum/image-map.jpg
The original image has been
sliced up into lots of smaller sections. Here they have been shown separately, but when you save the sliced image, the program will automatically
create a table to contain all the sections
rather like a jigsaw puzzle. No breaks will be visible between one piece and another.
During the creation phase of the sliced image,
you will probably be given the option to add links into each individual section. If that is NOT the case, with some knowledge of HTML you will be able to go into the table containing all the image sections, and create a link from any of the sections yourself.
The sliced image will be contained in a
<TABLE></TABLE> and each row of pieces in your image will be contained in a row
<TR></TR> and every single piece of the "image puzzle" will be contained inside a single cell
<TD></TD>.
Advantages of sliced images
I personally consider that there are
some interesting advantages
1.If you have some knowledge of
HTML you can open up the web page containing the sliced image table in your
*HTML Editor and actually remove a piece of the
jigsaw and replace it with another image of your choice, or an area of text.
Be very careful to make the new image you insert
exactly the same size as the piece of the "puzzle" you are removing.
Right click on the area of the image you wish to substitute in order to see the properties of that section (size, name etc.) and then be able to find it more easily inside the table.
2.When you slice your original image you will often find that the image program allows you to create
mouseover or rollover effects during the creative process.
3.You can
retain the quality of your original image because by
slicing it up into lots of small pieces, you are actually
preparing a higher quality image for a faster download
*Check out the CoffeeCup HTML Editor for your tables. You will also be able to access the CoffeeCup Image Mapper from the Editor
