Learnthat.com

Changing Graphic Properties

Use the Property Inspector to specify the properties of the images you insert, including height and width, alignment, spacing, and alternate text labels. Simply click the graphic to select it and change the following fields in the Property Inspector:

• Width and Height control the appearance of the image size. Be aware that these values do not actually change the size of the image, but its appearance on the page.
• V Space and H Space are values for the blank space appearing vertically and horizontally around the image.
• To place a border around the image, enter a numeric value for the border weight (for example, 1 for a thin border) into the Border field.
• The Align drop-down menu lets you set the alignment of the image in relation to the text within a paragraph.
• Type the alternate text for the image into the Alt field. This text appears as the graphic is loading, and is read aloud by software used by viewers with hearing disabilities. Including alternate text for each of your images helps ensure your site is compliant with the Section 508 standards for accessibility.

In addition, you can use an image as a hyperlink to another web page by entering the link to the page into the Link field.

More complex images can be used as image maps, which contain separate areas, called hotspots, that link to different web pages. To add a hotspot to a graphic:

1. Make sure the graphic is selected.

The hotspot tools are located in the lower left portion of the Property Inspector. Click the rectangle tool (the blue rectangle below the Map field).

2. Drag the mouse over the area on the graphic that you want to act as a hotspot. This is the area that the user can click to open the linked page.

The hotspot is displayed as a light blue-green rectangle on the graphic. This rectangle will not appear when the page is published.

3. When you finish drawing the hotspot, Dreamweaver opens the Hotspot Property Inspector, which allows you to define the properties for the hotspot.

4. Use any of the linking methods described earlier in this tutorial to enter a path into the Link field.
5. If necessary, select a target window.
6. Enter alternate text into the Alt field.
7. Enter a name for the hotspot into the Map field.

Tip:

Dreamweaver refers to each hotspot as an image map. When you enter a map name, you are naming only one of the hotspots, and not the entire series of hotspots contained in the graphic. Don't worry about the terms; just be sure to give each hotspot a unique name.

8. From here, you can add another hotspot by drawing a new area on the graphic, drawing a new area on a different graphic on the page, or selecting a different shape from the hotspot tools and drawing a new area. Enter the hotspot properties as described above.

Tip:

If you make a mistake and need to delete a hotspot, simply click the pointer tool next to the rectangle hotspot tool and select the hotspot on the page. Then press your Delete key. You can also resize a hotspot by clicking and dragging its selection handles.