Inserting/Formatting Images in DreamweaverInserting ImagesFormatting ImagesOptions for LINKINGWorking with IMAGE MAPSRollovers and MenusInserting/Formatting Images in DreamweaverInserting Images Select Insert, then Image to browse a list of available filesFormatting Images Once you have clicked on the image, the properties bar will appear on the bottom of the screen.Options for adjusting display:• W and H adjusts the width and height at which the image displays, but not the size of the actual file.• V Space/H space – the amount of space in pixels between the image and any text/images nearby. Ifyou’re wrapping text around a rectangular image, this is a must.Options for placing links• Low SRC – specifies a version of the image which is lower resolution than the final image. The low resimage will load first followed by the “real” image. Some sites will use a black and white version of a colorimage, others will use something with less DPI.• ALT – displays text which can be seen if the image fails to load or loads slowly. Some browsers displaythe contents of the alt attribute if the image is moused over.• Align –specifies where an image will appear relative to the text/image beside it. The most common use ismiddle (see below) which one line of adjacent text in the middle of the image:• If you have more than one line of text and want to wrap it around the image, you must use the Left orRight alignment (below)Options for LINKING• Link – if the image is intended to link to another HTML document, you can type a file name in the boxOR click on the folder to browse a list of available files.• Border – width in pixels of the border which will appear around the image. The color of the border willconform to your default link colors. If you don’t want a border, then set the border size to 0• Target – specifies where the link will open. If you want the link to open in a new window, set this to_new, otherwise, you need not worry about this one.Working with IMAGE MAPS • To have different parts of an image link to different URLs, use the map tools in the lower left corner ofthe image properties bar to select the parts of the image (see below)Double clicking on the hot spots will show a hot spot properties menu which lets you that portion of theimage. You may select the URL with the link button, target (see above, “working with links”) and alt (seeabove, “options for adjusting display”).Rollovers and Menus There are two ways of creating rollovers, both of which involve prior work with Fireworks.If you have created two or more versions of the same image, start at the Dreamweaver main menu and clickon Insert, then Interactive Images, then Rollover Image (see below).You will then see a menu which will prompt you for the file name of the main and rollover image; URL towhich the image should link; and ALT information: If you have created two or more versions of the same image, start at the Dreamweaver main menu andclick on Insert, then Interactive Images, then Fireworks HTML (see below).You will then be prompted to provide the name of the HTML file which will have the filenames for therollover graphics. Click on the image once it is imported to add the URL and Alt