The Workspace

1. Menubar – At the top, is the familiar Menubar that contains drop-down menus for the user commands such as File, Edit, View etc.
   
   
2. Insert bar – Below the Menubar is the Insert bar which you will use to insert elements into your webpage such as hyperlinks, email links, tables, DIV, SSI, comments and more.
   
   
3. Document Toolbar – The third row of buttons is the Document Toolbar which is where you will find the buttons that control the display views.
   
   
   1. Code – This view will show you the raw HTML code for your webpage.
      
      
   2. Split – This view will show you both the HTML code and the WYSIWYG view.
      
      
   3. Design – This is the WYSIWYG design view.
      
      
   Also on this toolbar, you have several other buttons that control features such as live preview options. We will get to know these well in the future.
   
   
4. Document Window – Below the three rows of buttons is the Document Window which displays the webpage depending on the type of display view you have chosen on the Document Toolbar.
   
   
5. Panel Groups – Dreamweaver simplifies your workflow by grouping related tools together in the CSS, Application and Tag Inspector Panel Groups.
   
   
6. Tag Selector – The HTML tags included in your webpage will be displayed on this line. When you select a tag from the Tag Selector, the code for that tag and any other code controlled by that tag will be highlighted.
   
   
7. Property Inspector – If you have worked with any of the Adobe software, you will be somewhat familiar with the Property Inspector which is where you set the properties for the elements on your webpage.
   
   
8. Files Panel – This panel works much like the Windows^R Explorer to display the hierarchy of your website files.