
an image file onto a page, you create a link from the page to the image, much as you do when you create a link from one page to another. As a result, if your images and the pages they are linked to are not in the same relative location on your hard drive as they are on your server, you break the links and your images do not appear on your pages (instead you get that ugly broken GIF image). The best way to make sure your images and files stay where theyre supposed to in relation to one another is to save them all in one main site folder and identify that folder using Dreamweavers Site Setup features covered in Chapter 2. Chapter 5: Adding Graphics 135 How an image appears on a Web page The HTML tag that you use to place images on a Web page is similar to the link tag that you use to create hyperlinks between pages. Both tags instruct the browser where to find something. In the case of the link tag, the path to the linked page instructs the browser where to find another URL. In the case of an image tag, the path in the tag instructs the browser to find a GIF or JPEG image file. The path describes the location of the image in relation to the page on which it appears. For example, images/baby.gif is a path that instructs a browser to look for an image file called baby.gif in the images directory. This path also implies that the images directory is in the same directory as the HTML file containing the link. Whenever you see a forward slash in HTML, it signifies a directory (or folder) that contains other files or folders. Trying to determine the path can get a little complicated. Fortunately, Dreamweaver sets the path for you, but you need to take care of two important steps before Dreamweaver can do this properly: 1. Save your page. When you save a page, Dreamweaver automatically remembers the exact location of the page in relation to the image. Saving the file is essential because the path always indicates the location of an image relative to the page containing the link (this is called a relative link). If you forget to save your file beforehand, Dreamweaver always prompts you to save the file before completing the link. If you dont save the file, Dreamweaver inserts an absolute link that references the images location on your hard drive, but this link isnt valid on any other machine or when you upload your Web site. An absolute link to your hard drive works on your machine, but not on your Web server - or any other machine, for that matter. 2. Define your site and identify your main Web site folder using the Site Setup features covered in Chapter 2. Aligning Images on a Page After you place an image on your Web page, you may want to center or align