INTRODUCTION

Dreamweaver is a WYSIWYG html program that allows you to design and publish web sites. It is a reasonably intuitive program and you will be most successful if you understand some basic HTML code.

For any web site to be easy to navigate, and to make use of Dreamweaver's site organization features, it is mandatory that you have a detailed plan before you begin.

This process includes:

• navigation map
• navigation system (buttons or other method(s) to link from one page to the next
• page template(s)
• site folder located on your hard drive, zip disk, or iPod
• folders within the site folder that will contain images, dreamweaver documents, and any other materials you will be using on your site (i.e. movies, animations, sounds, etc.)

Here are some resources that will help you in thinking about and planning your site:

planning:

• siteoutline.pdf
• planningguide.pdf

designing:

• 9tips.pdf
• designtips.pdf
• definedesign.pdf
• goodpractice.pdf
• websuffer.pdf

Please download these and READ THEM!

Only when you have established your plan and have created and/or collected the various parts should you launch Dreamweaver to begin building your site.

When you choose “new” in Dreamweaver, you get a panel that lets you define the kind of HTML document you want to create. We’ll be using basic HTML pages, and perhaps template pages.

Once you have a new document open, there are several panels that you’ll need to work efficiently.

WORKSPACE

Along the top of the document window is a tabbed menu used for inserting elements (the insert toolbar).

Within the top portion of the actual document are the document and standard toolbars, also available by selecting View > toolbars > document and/or standard.

The document toolbar controls the look and functionality of the document window. At the top left are buttons that allow you to switch between code view (the actual HTML that’s being written), a split view that shows both the HTML and the design space, and design view, which hides the HTML code.

The standard toolbar is about creating a new document, opening and saving documents, cutting, copying, and pasting elements, and undo and redo buttons.

The properties panel is the most useful. If it isn’t visible at the bottom
of your document, open it using the Window menu.

Along the right side of the document window are panels that streamline a lot of activities. The ones I use most are the Design panel, which includes the CSS tab and the layers tab; the Tag Inspector, which is used to assign ID’s (used with CSS); and the Files panel, which is where you see the lists of documents in your local site and your remote site. Having the Code Inspector available is also very handy. Open these panels from the Window menu.

The document space looks familiar: its behavior, however, is weird. You will be creating tables, layers, and inserting images and animations, so on one level, it feels like a canvas as in Illustrator or Photoshop. But it's more like a word processing program: you have to use the scroll bars to see different portions of your document—there is no hand tool and the Spacebar shortcut doesn't work. I find this extremely frustrating, but so it goes...

SITE PLAN

If you haven’t got some sort of organization defined for your site, you’re going to have a very difficult time putting it together. It’s critical that you have an outline, or even a series of index cards, that serve as a plan for the number of pages and each page’s contents.

Before you even begin in Dreamweaver, it’s smart to establish where your site files will reside—your hard drive or iPod (a zip disk just isn’t big enough, and you need all your files in one place, not multiple disks). Within that site space, you need to create folders; one for each page in your site, including one for the things that will appear on the “first” page (index.html), even though that particular file (index.html) needs to be at the root level of your site space.

Every site demands a different setup or organization. Your site space may need more or fewer levels of folders, depending on what you’re doing.

Suffice to say, without a plan in the beginning, you’ll be redoing a lot of work to make things work if you skip this step.