Dreamweaver - CS3

Lesson 2: Introduction (2)

2/58 Lessons 

The working environment

In order to view the work environment, open a new page. Just click “HTML” in the middle column of the Welcome screen. All pages, at least the standard pages have the extension “.Html” or “.Htm”.

Dreamweaver CS3 makes them automatically as xhtml pages, but this only has to do with the declaration of the source code, for the rest you will not notice it.

Save the page as index.html (if you later wish to use it as your homepage for your site, you MUST save with the name index, the extension does not matter, this should be “.htm” or “.html” for static pages, “.php” or “.asp” for dynamic sites).

Click on “File” in the menu bar and choose “Save” in the drop-down menu.

Select the folder where you want to save the page, in this example, the folder “Free Course” on my desktop, give the file name as index.html and click the “Save” button.

This places the file in the “Files” panel.

Now a word about the work environment.

At the top we have the menu bar. This always includes, as in any application where you work, all existing options.


Insert Toolbar

Under the menu, we find the Insert Toolbar:

The insert bar contains buttons for inserting objects such as tables and images.

When you hover over a button, you will see the name of this button.

Next to some of these buttons, we have a black arrow pointing downwards.

When you click on this button, it displays a drop-down menu with various options.

You select an option from this drop-down menu, then this is the default action for this button and this will also change the icon.


These buttons are divided into several categories:

  1. The Common category
    Allows you to insert objects such as images and tables.
  2. The Layout category
    Allows you to insert tables, div tags, frames, and Spry objects. You also have two views for tables: Standard (default) and Extended tables.
  3. The Forms category
    This category contains buttons for creating and entering forms and form elements, including Spry validation objects.
  4. The Data category
    Allows you to inser Spry data objects and other dynamic elements.
  5. The Spry category
    This category contains buttons for building Spry pages with Spry data objects and Spry objects.
  6. The Text category
    Allows you to insert various text and list formatting tags.
  7. The Favorites category
    Allows you to group the buttons you use the most on the Insert in one location. For this, select the tab “Favourites” rightclick the Insert and in the dialog box that appears, select the button you want to add to this tab and click the button with the double arrow.
    If you want to remove a button, highlight it in the right pane of the dialog and click the trash icon.
    If you want to change the ranking of a button, highlight it in the right part of the dialog and click the up or down pointing arrow.
    If you wish to add a separator between two groups of buttons, click the “Add Separator” button.


You've completed Lesson 2