adobe dreamweaver cs5 on demand part 11 ppsx

ptg
Managing Web Site Files
Introduction
A Web site is made up of numerous files. As you continue to
create more and more Web pages and other files for a Web
site, keeping track of them becomes an important job.
Managing Web site files is an important part of creating an
organized site that one or more developers can work on.
In Dreamweaver, there are three main site folders: local
root, remote, and testing server. The local root and testing
server folders are the working development folders for your
Web site, while the remote folder is the Web server folder
that visitors access on the Web. Instead of using Windows
Explorer (Win) or Finder (Mac) to manage and work with Web
site files, you can use the Files panel. When you create or
open a Web site, the Files tab in the Files panel displays all
the site’s files, which you can use to quickly and easily man-
age individual Web pages, files, and folders. If you can find a
file on your site, you can also use the Files panel to help you
locate it.
If you’re creating a custom template or sharing files with
someone who needs them for use in another program, you
can use the Save As dialog box to change the file type for a
Web page or other related file.
When you create a Web page, one of the first things to do
is to apply some general settings to your page. The Page
Properties dialog box lets you specify the default font family
and font size, background color, margins, link styles, and
many other aspects of page design. You can assign new page
properties for each new page you create, and modify those
for existing pages. Dreamweaver allows you to embed these

changes to the page using HTML or CSS (Cascading Style
Sheets), depending on your preference.
4
4
What You’ll Do
Explore Web Site Files and Folders
Set Up Site Folders
View the Files Panel
Open and Create Files in the Files Panel
Manage Files and Folders in the Files
Panel
Find Files in the Files Panel
Save a File with Different Formats
Identify Dreamweaver File Formats
Set the Home Page
Prepare to Set Page Properties
Set Appearance Page Properties
Set Link Page Properties
Set Heading Page Properties
Change Title and Encoding Page
Properties
Insert a Tracing Image
Use Visual Aids
Work with Invisible Elements
Select Elements
67
From the Library of Wow! eBook
From the Library of Michele Renth
ptg
68 Chapter 4

server folder on your local computer or appli-
cation server. In order to set up a testing
server folder, you need to define the local
and remote folder first.
Web site development takes place in the
local folder, while Web site final production
takes place in the remote folder. After you fin-
ishing developing files and folder in your
local folder, you can upload them to your
remote folder. The folder structure in the local
and remote folders should always be the
same. If the folder structure is not the same,
files upload to the wrong location and links
to files don’t work. So, making sure the folder
structure of the local and remote are the
same is very important.
You can name and specify the location of
the local folder. However, the remote folder
name and location is typically provided by
your Web server administrator. After you find
out the name and location of your remote
folder, you can establish a connection to it
from Dreamweaver. If the remote folder
name and location is not available at the
moment, you can still set up a local folder
now and start creating Web site files, and
then specify the remote and testing folders
later.
Typically, you work on files in your local
folder and then upload them to your remote

folder. However, you can also work on files
directly on your remote site in Dreamweaver.
When you make a change to a remote site
file make sure you also update the local site
file too so they are both the same.
A Web site consists of linked documents and
related files organized into folders. You can
use Dreamweaver to organize and manage
your site files and folders, and maintain your
links. With Dreamweaver, you can create,
develop, and work with site files and folders
on your local hard disk and upload them to a
Web server where visitors on the Web can
access it.
Working with Site Folders
The development environment for a
Dreamweaver site consists of three main
folders: Local root, Remote, and Testing
server. The
local root
folder, known as the
“local site,” stores your site files and folders
you work on during development. You can
store the local root folder on your local com-
puter or a network server. The
remote
folder,
known as the “remote site,” stores your site
files and folders for production on the Web.
The remote folder is typically the Web server,

known as a production server, where visitors
access your site on the Web. If you plan to
use dynamic pages—Web pages that change
based on circumstances—in your Web site,
the Web server also needs to run an applica-
tion server. An
application server
is a network
server with software, such as ColdFusion,
ASP, ASP.NET, JSP, or PHP, that processes
dynamic pages. If you want to test dynamic
pages during development, you also need a
testing server
folder, which provides a place
to generate and display dynamic content
while you work. You can store the testing
Exploring Web Site Files and Folders
From the Library of Wow! eBook
ptg
Chapter 4 Managing Web Site Files 69
In Dreamweaver, there are three main site folders: local root, remote,
and testing server. The local root folder is the working development
folder for your Web site. The remote folder is the Web server folder for
your Web site. This is the location on the Web where visitors access
your Web site. The testing server folder is a development folder for
generating and displaying dynamic page content while you work. A
dynamic page is a Web page that changes based on circumstances.
The other type of Web page is a static page, which only changes when
you edit it. You can set up site folders when you create a new site or
edit an existing one. If you don’t know the settings for the remote and

testing server folders, you can set up a local folder now, start creating
Web site files, and then specify the remote and testing folders later.
Setting Up Site
Folders
Set Up Site Folders
Use one of the following methods:
◆ New Site. Click the Site menu,
and then click New Site.
◆ Exist Site. Click the Site menu,
click Manage Sites, select the
site you want, and then click
Edit.
Click the Site category.
Click the Browse For Folder icon,
locate the local folder you want to
use, and then click Select.
Click the Servers category.
Click the Add New Server button,
specify the server name,
connection type, address,
username and password, and root
directory on the Basic tab (New!).
Click the Advanced tab, and then
select testing server model and
access method you want to use to
display dynamic page content
(New!).
Click Save, and then click OK
to cache files, if necessary.
Select the check box for the

Remote and Testing server you
want to use (New!).
Click Save.
9
8
57
6
5
4
3
2
1
8
9
5
2
3
4
From the Library of Wow! eBook
ptg
70 Chapter 4
The Files panel is a useful place for managing files and folders. When
you create or open a Web site, the Files tab in the Files panel displays
all the site’s files. If you want to change locations, you can use the Site
list arrow in the Files panel to select a remote server, local drive, or
desktop. The Files tab displays the file hierarchy of all the folders and
files in your Web site in different views, either local, remote, testing, or
repository version control from Subversion. Using the plus sign (+) and
the minus sign (-) to the left of an icon in the Files tab allows you to dis-
play different levels of folders in your Web site without opening and

displaying the contents of each folder. If you want to display two differ-
ent views, you can expand the Files panel.
Viewing the
Files Panel
View Files in the Files Panel
Select the Web site in which you
want to view.
Click the Window menu, and then
click Files to display the Files
panel.
Click the Site list arrow, and then
select the location where you
want to view files.
Click the Site Files View list arrow,
and then select the view you want.
◆ Local View. Displays the folder
structure of the site on your
computer (Default view).
◆ Remote Server. Displays the
folder structure of the site on a
Web server.
◆ Testing Server. Displays the
folder structure of the testing
and local site.
◆ Repository View. Displays the
Version Control site files using
Subversion.
Perform the commands you want
to display folder structure and
contents:

◆ To sh ow th e fi le and fo ld er
structure, click the Plus
sign (+).
◆ To hi de th e fi le and fo ld er
structure, click the Minus
sign (-).
◆ To di sp lay th e conten ts of a
folder, click the folder icon.
5
4
3
2
1
3
4
5
From the Library of Wow! eBook
ptg
Chapter 4 Managing Web Site Files 71
Work with the Files Panel in
Expanded View
Select the Web site in which you
want to view.
Click the Window menu, and then
click Files to display the Files
panel.
The Files panel appears, displaying
the Files tab.
Click the Expand button to expand
the Files panel.

The Files panel expands to display
the remote site, testing site, or site
map on the left and the local site
on the right.
Click a button on the toolbar to
display the view you want:
◆ Remote Server. Displays the
remote site.
◆ Testing Server. Displays the
testing site.
◆ Repository Files. Displays the
Version Control site files using
Subversion.
Click the Collapse button again to
collapse the Files panel.
5
4
3
2
1
3
Click to expand/collapse
4
See Also
See “Managing Files and Folders in the
Files Panel” on page 74 for information
on working with site files in different
views.
From the Library of Wow! eBook
ptg

72 Chapter 4
Instead of using Windows Explorer (Win) or Finder (Mac) to manage
and work with Web site files, you can use the Files panel. After you
open a Web site, you can quickly open files using the Files panel
instead of using the Open command on the File menu. The Files panel
displays all the files for the working site. If you want to open a file for
another site, you need to use the Open command on the File menu, or
switch the working site and use the Files panel. In addition, you can
create a new file. When you do, Dreamweaver creates the new file in
the same folder as the selected file.
Opening and Creating
Files in the Files
Panel
Open a File in Files Panel
Select the Web site in which you
want to view.
Click the Window menu, and then
click Files to display the Files
panel.
Click the Site list arrow, and then
select the location where you
want to view files.
Click the Site Files View list arrow,
and then select Local View.
Use any of the following methods:
◆ Double-click the file icon.
◆ Right-click (Win) or Control-
click (Mac) the file icon, and
then click Open.
5

4
3
2
1
3
5
4
Did You Know?
You can refresh the Files panel.
If you
don’t see a file or folder you know is in
the Files panel, click the Refresh button
(Dreamweaver sites only) or right-click
(Win) or Control-click (Mac), and then
click Refresh.
From the Library of Wow! eBook
ptg
Chapter 4 Managing Web Site Files 73
Create a File in Files Panel
Select the Web site in which you
want to view.
Click the Window menu, and then
click Files to display the Files
panel.
Click the Site list arrow, and then
select the location where you
want to view files.
Click the Site Files View list arrow,
and then select Local View.
Select a file where you want to

place the new one.
Right-click (Win) or Control-click
(Mac), and then click New File.
Enter a name for the file or folder,
and then press Enter (Win) or
Return (Mac).
7
6
5
4
3
2
1
5
4
6
3
7
Did You Know?
You can control what applications
open specific files.
For example, you
might want to open your .gif files using
Fireworks, or you might want to use
Photoshop. Click the Dreamweaver
(Mac) or Edit (Win) menu, and then
click Preferences. Click the File
Types/Editors category, make your
changes, and then click OK.
From the Library of Wow! eBook