Images and Client-side image maps

Adding an image

To insert an image choose Image from the Types menu or click on the button (or use the keyboard shortcut control-t, control-i in Unix). This brings up a dialog box that lets you enter the file name and alternative text ('ALT' text) of the desired image. If you wish to provide a long description (for example if your image presents complex information) you should do so in a separate document and link it by giving the URI as a longdesc, also available in the Attributes menu. To help find an image file you can enter a filter field, and use the filter button, so the dialog lists only the files which match your pattern.

Alternative Text and Long Descriptions

For elements such as images (and other multimedia objects) you must provide alternative text. This will usually be presented instead of the image by a browser with a voice output system, or a Braille display (used by many people who are blind). It is also common for users with low-quality connections to request the alternative view, as text is transmitted much faster than images.

The alternative text should replace the image in function. For example, if the image is used to provide an icon linking to a reference point (the first link on this page, to the W3C 'homepage', is such a link) then the title of the reference would be a good alternative text.

There are also cases where an image is used for purely visual effect, and does not add any information value to the page. In this case it is appropriate to use a blank alternative, although that must still be defined - enter two double quotes for alternative (eg. alt="").

In cases where the image conveys important information which is not available from the text of the document you must also provide a description of the information. The longdesc option of the Attributes menu allows you to link a description (which is a URI - a separate document, or named part of the current document) to the image.

In order to give an idea of how a page might be presented without the images, Amaya provides a Show Alternate option in the Views menu. If the page were spoken, then the alternate view might simply be read out. Without useful alternative text for images, many pages become difficult or impossible to navigate, and users are left 'feeling their way in the dark'.

Using client-side image maps

Amaya allows you to use client-side image maps:

• To activate an area in a map, double-click on the area with the left mouse button. The URI attached to this area is then fetched.
• To display existing areas, choose Show Map Areas from the Views menu.

Creating client-side image maps

To create a new image map, you insert an image into the document, and define areas as links.

To create an area in a image, select the image or an existing area of that image. Then choose Rectangle, Circle, Polygon from the Area Map submenu of the Types menu, depending on the shape of the new area you want to create. The Show map areas option in the Views menu will outline each of the existing map areas on an image.

• To create a rectangular or circular area, you must first select the position of one corner by pressing the left mouse button. Keep the button pressed down and move to the position of the opposite corner, then release the button. The area is now defined.
• For a Polygon, enter each point by clicking the corresponding position with the left mouse button. To indicate the last point, click with the middle button.

When the area has been defined, you must first provide alternative text in the dialogue provided and then enter the target of the link associated with that area. Just select the target (or enter its URI if it is not displayed), in the same way as you create links.

Moving image map areas

When the area has been defined, you can move this area:

• By direct manipulation - combining the Control key with the Left button of the mouse within an area of image map allows you to move this area.

• By editing the coords attribute of the area in the Structure View.

Resizing image map areas

• By direct manipulation - combining the Control key with the Middle or the Right button of the mouse within an area of image map allows you to resize this area.
• By editing the coords attribute of the area in the Structure View.