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

Because you no longer will use the nb_logo.gif image in the NextBest Fest site, you
can delete it from the graphics folder to minimize the size of the site fi les.

To delete the nb_logo.gif file from the site:

◗

1. In the Files panel, expand the graphics folder, if necessary.
◗

2. Select the nb_logo.gif file, and then press the Delete key. Click Yes in the
Dreamweaver dialog box to confirm deletion. The file for the unneeded logo is
removed from the graphics folder.

Next, you will add the logo to the about.html page of the NextBest Fest site. The
nb_logo.png fi le is stored in the graphics folder within the local root folder. So rather
than saving a second copy of the fi le in the graphics folder, you'll insert the copy of the
fi le that is already in the graphics folder.

To add the logo to the about.html page:

◗

1. Open the about.html page in Design view.
◗

2. In the status bar, click the <div#content> tag to select the content div, and then
press the Left arrow key to move the insertion point before the content div.

◗

3. In the Common category of the Insert panel, click the Image button in the
Images list. The Select Image Source dialog box opens.

◗

4. Navigate to the nextbest_fest\web\graphics folder in the local root folder, and
then double-click nb_logo.png . The Image Tag Accessibility Attributes dialog
box opens.

◗

5. In the Alternate text box, type NextBest Fest logo linked to the home page.
(including the period), and then click the OK button. The NextBest Fest logo
appears in the upper-left corner of the about.html page and the content div
moves down.

◗

6. With the logo selected, in the Property inspector, click the Class arrow, and then
click logostyle . The style is applied to the logo, which moves to the center of
the page.

◗

7. Save and close the about.html page.

Using the Assets Panel to Insert Graphics
Another way to add graphics to Web pages is to use the Assets panel. In Dreamweaver,
assets are the images, colors, URLs, Flash, Shockwave, movies, scripts, templates, and
library items that you use throughout a site. The Assets panel is used to manage these
assets. The Assets panel helps you keep track of the assets in the site by listing them all in
one place.
The Site list displays all the assets used in the site, which can become quite lengthy in
large sites. To make the list easier to work with, you can add assets you use frequently to
the Favorites list. Assets in the Favorites list are simply references to the assets in the Site
list. To help organize either list, you can create folders to store items in. You can place an
asset in the site or edit an asset from either list.
After a graphic is stored in the site's local root folder, you can use the Assets panel
to place the graphic in other pages. When you display images in the Assets panel, the
graphic image appears in the upper pane and the graphic's fi lename, type, size, and
location appear in the lower pane.

To add an asset to the
Favorites list, right-click
the asset in the Site list or
the Files panel, and then
click Add to Favorites.
To remove the asset
from the Favorites list,
click the asset, and then
click the Remove from
Favorites button.