The Dreamweaver Environment

Macromedia Dreamweaver is a powerful website development tool. Despite all its powerful features, it’s also surprisingly user-friendly. (After struggling to learn Photoshop, you’ll probably find Dreamweaver a nice change of pace.)

Dreamweaver contains an intuitive interface for creating professional-looking websites quickly. The program also features several programming tools that allow you to design data-driven web-based applications.

1. 
   
   The first time you fire up Dreamweaver, it’ll ask you if you wish to use a Design or Code layout. For our purposes, select the Design layout.
   The Design layout allows users to work in a WYSIWYG environment.

   Note

   A WYSIWYG (pronounced WIZ-zee-wig) application allows users to see on their monitor exactly what their document will look like when viewed in its final form. In Dreamweaver, what you type on the Design layout is a WYSIWYG display of the web page.

   Tip

   If you accidentally select the Code layout, don’t worry. You can decide which layout you wish to use once you are in Dreamweaver. Once you start a new page or open an existing HTML page (which you’ll learn to do in a moment), go to Window ▶Workspace Layout in the menu bar. A submenu displays. Here, you can select the Design layout. You can also select the Dual Screen item from this submenu. This allows you to view both the Designer and Code layouts at the same time.

   After selecting the Design layout, a menu screen displays, as shown in figure below.
   
   
   
2. 
   
   Select the Open folder (from the Open a Recent Item column). An Open dialog box displays.
3. 
   
   Select the bing_home.html file you created in previous tutorial.
4. 
   
   Press the Open button. The bing_home.html file opens within your Dreamweaver environment.
   
   In this tutorial:
   

   1. Working with Dreamweaver
   2. The Dreamweaver Environment
   3. Exploring Dreamweaver Environment