Setting the stage

Figure 1 shows the Birdland site in its original form; Figure 2 shows the site after I used Photoshop and Fireworks to "jazz" it up.

Figure 1. The original Birdland website.

Figure 2. The Birdland website after I jazzed it up.

Before delving into the Birdland project, you will want to set the stage for the application. In this section of the tutorial you will perform the following tasks:

• Specify editors for various file types in Dreamweaver
• Set up a Dreamweaver site definition

Specify editors for various file types in Dreamweaver

Dreamweaver lets you choose the external application that it will automatically launch when you click on files of a compatible type in the Dreamweaver Files panel. To specify which file types you want to associate with a specific tool, follow these steps:

1. Choose Dreamweaver > Preferences (Mac), or Edit > Preferences (Windows).

2. Under Category, choose File Types > Editors (see Figure 3).

   

   Figure 3. The File Types / Editors Preferences dialog box on a Mac.

3. Select any image extension, such as .png, .jpg, or .jpg in the Extensions list.
4. Select an application in the Editors column. (Dreamweaver is smart about locating appropriate image editing applications, but you can also click the plus (+) button to navigate to other applications and add them.)
5. Click the Make Primary button to set the application as the default.
6. Repeat steps 3 through 5 for each extension you want to set up. If you do not see a particular extension in the list, you can click the plus button (+) to add it.

Set up a Dreamweaver site definition

The first step in setting up a new site in Dreamweaver is to create a site definition. This allows Dreamweaver to manage files and helps you use its productivity features, including image editing.

1. Choose File > New Site.

2. Click the Advanced tab in the Site Definition dialog box (see Figure 4).

   

   Figure 4. Setting up the site definition for the Birdland site.

3. In the Site Name field type Birdland.
4. For the Local root folder, click the Browse button and navigate to where you want to save the files for the Birdland site.
5. Create a new folder named Birdland.
6. Click Choose (Mac), or click Open and then Select (Windows).
7. Click OK.
8. If you haven't already done so, download the support files for this tutorial.
9. Locate the starter_files folder and copy the images and index.html file inside it to the Birdland folder you designated as the local root folder of the Birdland site.

Note: For more information on setting up a site, refer to the Dreamweaver online help.

Page 2 of 4

Previous Page

Next Page