Insert an image placeholder

An image placeholder is a graphic that you use until final artwork is ready to be added to a web page. An image placeholder is useful when you lay out web pages because it allows you to position an image on a page before you actually create the image.

1. In the Document window, click once inside the first row of the first table.
2. Select Insert > Image Objects > Image Placeholder.
3. In the Image Placeholder dialog box, do the following:
   • Type banner_graphic in the Name text box.
   • Enter 700 in the Width text box.
   • Enter 90 in the Height text box.
   • Click the color box and select a color from the color picker. For this tutorial, select a reddish brown (#993300).
   • Leave the Alternate Text text box blank.

     ABOUT...

     A note on alternative text Alternative text is a textual description of an image on a web page. It is part of the HTML code and does not appear on the page. It’s important to provide alternative text for most of your images so that people who use screen readers or text-only browsers can receive the information provided by the image. In the case of a banner graphic, which merely displays a logo for a website, it is not essential to provide alternative text. When you leave the Alternate Text text box blank in the Image Placeholder dialog box, Dreamweaver adds an alt="" attribute to the img tag. Later, if you want to add alternative text to an image, you can select the image and enter the alternative text in the Property inspector. For example, if you later change the logo to include a phone number or address, you would want to provide that information as alternative text.

4. Click OK.

   The image placeholder appears inside the first table. The image placeholder displays a label and the size attributes of the image that you’ll eventually place there.

   

   NOTE

   When viewed in a browser the label and size text for an image placeholder do not appear.

5. Save your page.

   ABOUT...

   About image placeholders An image placeholder is a graphic you use until final artwork is ready to be added to a web page; it is not a graphic image that displays in a browser. Before you publish your site, replace any image placeholders you’ve added with web-friendly graphic files such as GIFs or JPEGs. If you have Macromedia Fireworks, you can create a new graphic from a Dreamweaver image placeholder. When you select the image placeholder and click the Create button in the Property inspector, Fireworks opens and presents you with a new canvas. The new image dimensions are set to the same size as the placeholder image. You can then create and edit the image as you like, and replace the placeholder image in Dreamweaver. For information about creating an image in Fireworks from an image placeholder, see Using Fireworks to modify Dreamweaver image placeholders in Using Dreamweaver.