If you're new to Dreamweaver, I have just the answer you are looking for to get up to speed fast. I have created a series of interactive Macromedia Captivate simulations that will help you get started with Macromedia Dreamweaver 8. These simulate the Dreamweaver web development environment and require you to participate as if you were actually in Dreamweaver. These simulations cover the same material as the getting started tutorials in the Dreamweaver Help (Help > Getting Started with Dreamweaver). Once you have completed the simulations, I recommend that you go through the written tutorials that are linked at the bottom of this article.

Requirements

To complete this tutorial you will need to install the following software and files:

Dreamweaver 8

• Try
• Buy

Tutorials and sample files:

The files referenced in the Captivate simulations are installed with Dreamweaver 8. On Windows, you can find them here: C:\Program Files\Macromedia\Dreamweaver 8\Tutorial_assets\cafe_townsend

On Macintosh, you can find the files here:

/Applications/Macromedia Dreamweaver 8/Tutorial_assets/cafe_townsend

Note: If you click any of the links below and the page doesn't load, the browser window may already be open and hiding behind this browser window. The simulations require you to enter text in text fields as if you are in Dreamweaver. If you have already completed the text entry boxes and press back in the playback controls, these text fields will already be filled in.

Getting Started

Setting Up a Site

This tutorial introduces you to the concept of a Macromedia Dreamweaver site and shows you how to set up the project files for the Café Townsend website. Click the link below to begin the simulation.

• Play the simulation: Setting Up a Site

Dreamweaver Workspace Preferences

Dreamweaver 8 gives you the flexibility to customize your workspace to suit your requirements. In this tutorial, you will change the Dreamweaver workspace layout, customize and dock panel groups, and switch between different Dreamweaver views. Click the link below to begin the simulation.

• Play the simulation: Dreamweaver Workspace Preferences

Creating a New Document

Macromedia Dreamweaver 8 offers a flexible environment for working with a variety of web design and development documents. In addition to HTML documents, you can create and open a variety of text-based documents, including XHTML, CFML, ASP, ASPX, JSP, PHP, XML, XSL, JavaScript, and CSS. Dreamweaver also supports source code files, such as Visual Basic, .NET, C#, and Java. Click the link below to begin the simulation.

• Play the simulation: Creating a New Document

Creating a Table-Based Layout

Inserting Tables

Tables are a powerful tool for presenting tabular data and for laying out text and graphics on an HTML page. You can use tables to create your layout quickly and easily. In this tutorial you'll create a number of tables in a new Dreamweaver document. The rows and cells of the tables effectively act as container boxes for the content you'll add later. Click the link below to begin the simulation.

• Play the simulation: Inserting Tables

Setting Table Properties

In this simulation, you'll set precise table properties, using Expanded Tables mode, a feature that temporarily adds cell padding and spacing to tables and increases the borders of the tables to simplify editing. Specifically, it lets you position the insertion point precisely without accidentally selecting the wrong table or other table content. Click the link below to begin the simulation.

• Play the simulation: Setting Table Properties

Inserting an Image Placeholder

An image placeholder is a graphic you use until final artwork is ready to be added to a web page; it is not a graphic image that displays in a browser. Before you publish your site, replace any image placeholders you've added with web-friendly graphic files such as GIFs or JPEGs. Click the link below to begin the simulation.

• Play the simulation: Inserting an Image Placeholder

Adding Color to the Page

In this section, you will add more color to the page by setting colors for some of the table cells and for the background of the page. Click the link below to begin the simulation.

• Play the simulation: Adding Color to the Page

Adding Content to Pages

Inserting Images

Having created your page layout, you are ready to add assets to the page. You'll start by adding images. You can use several methods to add images to a web page in Dreamweaver. In this section, you'll add four different images to the index page for Café Townsend, using various methods. Click the link below to begin the simulation.

• Play the simulation: Inserting Images

Inserting and Playing Flash Files

In this tutorial, you'll insert a Macromedia Flash file that plays a photographic slide show of Café Townsend's featured food items. The Flash file you'll insert is a flexible messaging area—or FMA—file.

• Play the simulation: Inserting and Playing Flash Files

Inserting Flash Video Files

Dreamweaver lets you easily insert Macromedia Flash Video content in your web pages without using the Flash authoring tool. Dreamweaver inserts the Flash Video component; when viewed in a browser, this component displays the Flash Video content you select, as well as a set of playback controls. Click the link below to begin the simulation.

• Play the simulation: Inserting Flash Video Files

Inserting Text

To add text to a Dreamweaver document, you can type text directly in the Dreamweaver Document window, or you can cut and paste. You can also import text from other documents. Click the link below to begin the simulation.

• Play the simulation: Inserting Text

Creating Links

In this tutorial, you will learn how to create hypertext links, how to build named anchors, and how to check your document for broken links. Click the link below to begin the simulation.

• Play the simulation: Creating Links

Inserting Lists

In this tutorial, you will learn how to create a bulleted (unordered) and numbered (ordered) list from existing text. Click the link below to begin the simulation.

• Play the simulation: Inserting Lists

Previewing Pages in Your Browser

While the Dreamweaver Design view does an excellent job of rendering your pages, you still need to test your pages in several browsers. Luckily Dreamweaver has a Preview in Browser feature to make this a snap. Click the link below to begin the simulation.

• Play the simulation: Previewing the Page in Your Browser

Publishing Your Site

This tutorial shows you how to set up a remote site with Macromedia Dreamweaver 8 and publish your web pages. A remote site is usually a place on a remote computer, running a web server, that holds copies of your local files. Users access the remote site running on the web server when they view your pages in a browser. Click the link below to begin the simulation.

• Play the simulation: Publishing Your Site

Where to Go from Here

Once you have finished the simulations linked above, I recommend that you complete the written tutorials to reinforce what you have learned. You can find the tutorials in the Dreamweaver Help System (Help > Getting Started with Dreamweaver) as well as on LiveDocs using the following links:

• Tutorial: Setting Up Your Site and Project Files
• Tutorial: Creating a Table-based Page Layout
• Tutorial: Adding Content to Pages

About the author