Skip Navigation.

Dreamweaver: The Interface

Views
Dreamweaver has two different "views" available to its users. The default view, often described as WYSIWYG, is called the design view; its opposite, which allows users to directly manipulate the HTML code, is called the code view. Depending on your experise and your aims, either view may be useful for you.
Design View Code View
Design View
(Click for enlargement)		 Code View
(Click for enlargement)

The popularity of Dreamweaver stems, in part, from the availability of both, and its relative grace regarding HTML code.

Properties Window
One of the strengths of Dreamweaver is that it allows users to alter the attributes of their documents through easy-to-use windows, dialogs, and the like. Many of these alterations occur through the properties window, which appears by default at the bottom of the screen.
Dreamweaver Properties Window
Dreamweaver Properties Window
(Click for enlargement)

When a user selects a portion of the document, the properties window displays the options available to that user, such as those options shown above for the <FONT> tag.

Toolbars Dreamweaver Toolbar
Dreamweaver, like most Macromedia products, has a plethora of toolbars and windows available for you to use. It is beyond the scope of these help pages to detail all of them, but we will discuss a few of the major tools from the objects toolbar (pictured right) here:
  1. Insert Picture - insert an image in your document.
  2. Insert Rollover Picture - insert an image that will "rollover" into your document.
  3. Insert Table - insert a table into your page and to format that table as you see fit.
  4. Insert Table Data - add a data box to your table.
  5. Draw Layer - draw layers for your page (Netscape feature).
  6. Insert Navigation Bar - create and add a navigation bar on your page.
  7. Insert Horizontal Rule - add a horizontal rule (like the one just below the "back" link at the bottom of this page).
  8. Insert Email Link - add a link that opens an email window.
  9. Insert Date - add the current date to your page.
  10. Insert Server-Side Include - add a server-side include command (What are server-side includes?).
  11. Insert Fireworks, Flash, Flash Button, Flash Text, Shockwave, Generator - add information generated by other macromedia products.
  12. Layout - These tools are only available when in Layout View. They help you draw specialized tables.
  13. View - Normal or Layout view. The Layout view allows you to draw and manipulate tables easily with the mouse. Good for complex layout and design.


Site Window
The Site Window allows for overall management of your website. It displays a 'map' of the heirarchy of your site and allows you to see what documents are in the file with your documents.

Dreamweaver Site Window
Dreamweaver Site Window
(Click for enlargement)

The general interface for Dreamweaver is not very dissimilar from any of the other macromedia products available for use in the IMAGE lab. It uses lots of menus and windows, and is easily used in tandem with other programs.

Back