Working with Graphics and Tables - New Perspectives on Adobe Dreamweaver CS5, Comprehensive - page 239

Figure 5-4 Tickets graphic as a PNG image

gray bac k ground
shows through the
transparent area

tickets image is 38 K

transparent background

Adding Graphics to Web Pages
The fi rst time you place a graphic in a Web site, you use the Insert panel to place the
graphic in the page. When you add a graphic to a Web site, the best place to store it is in
the graphics folder within the site's local root folder so that Dreamweaver always knows
where to locate the image fi le. You need to include only one copy of each graphic in
the graphics folder, even when you plan to use the same image in several pages. After a
graphic is stored in the local root folder, it appears in the Assets panel. Then, you can use
either the Files panel or the Assets panel to insert that graphic into the pages.
When you place a graphic in a page, you are actually placing an image tag, <img>, in
the page. The image tag tells the page to display the graphic stored in the graphics folder
at that spot in the Web page. When the same graphic appears multiple times in a site,
Dreamweaver retrieves the graphic from the graphics folder and displays it in the various
locations. If you decide to change a graphic in the site, you can simply replace the old
graphic with a new one with the same fi lename in the graphics folder, and each page
that contains an image tag for the old graphic then displays the new one.

Adding a Graphic to a Web Page
• In the Common category of the Insert panel, click the Images button arrow, and then
click the Image button.
• Select the file to insert in the Select Image Source dialog box.
• Click the OK button.
or
• In the Files panel group, click the Assets tab.
• On the Assets panel toolbar, click the Images button.
• Click the file you want to insert, and then click the Insert button in the Assets panel.
or
• Drag the image from the Files panel or the Assets panel to its position in the page.