2.3. Images
Insert an image
When you have looked at layout tables you will see that they can be used to place images quite precisely on your page. For now we shall just place our image in the middle of the text. We shall use an absolute address for our image, as we did for the text hyperlink. Later on you will see how to link to an image on your own site.
- Place the flashing cursor after your link to the home page and press Return
- Click the Insert Image button
in
the Insert Panel Group (the "Common" section)
or choose Image from the Insert menu -
You will see a dialog-box very similar to the one for the Link, and you should type the URL for the image into the URL box:
http://www.st-and.ac.uk/images/icon_work.gif
You will not see your image displayed on the page in Dreamweaver, but if you look in your browser it should appear (provided you are connected to the network).
- Save your page and preview it in the browser as you did before
Note:
When you are using absolute image links and you are linking to an image that does not form part of your own website as in this example, you must obtain permission from the owner of the website where the image is stored. If you do not obtain this permission, you may be breaching copyright.
Format your image
If you click on your image to select it (so that little black squares called handles appear on the edges) the Text Properties box will change to become the Image Properties box. The intial Image Properties box may look like this:

If you click the downwards pointing arrow
in
the right-hand bottom corner of the Image Properties box, it will expand
and look like this:
In the Alt box type a short piece of text. It is important that the information provided in the alt box is as descriptive as possible. These are the details that will be displayed by the browser if, for any reason, it cannot display the image, or if your reader has decided not to display the images. More importantly this is the information the software used by visually impaired people visiting your page will read out to them.
You can also use the W and H boxes to force the image to be displayed by the browser with the measurements you choose, but this is something you should only do in special circumstances. As a rule you should use your graphics program to create an image of the size that you want rather than using the browser to re-size the image.
To change the horizontal alignment of your
image you can use these fields
.
You can also use the dropdown menu next to Align to alter the alignment of your image. You will find some of the additional options in this dorpdown menu useful once you have learnt how to use tables and to place an image into a cell of a table.
©