Use the visual design tools in Macromedia Dreamweaver 8 to create sophisticated page layouts.

• Laying Out Pages with CSS (cascading style sheets)
  • Dreamweaver includes a number of visualization features that let you display elements of your CSS layout in Design view. For example, you can display the outlines of div tags that don’t have borders assigned to them, or you can display temporary background colors for div tags so that you can see their location on the page.
    
    
• Presenting Content with Tables
  
  
  • About tables
    • Macromedia Dreamweaver 8 provides two ways to view and manipulate tables: Standard mode, in which tables are presented as a grid of rows and columns, and Layout mode, which allows you to draw, resize, and move boxes on the page while still using tables for the underlying structure (see Laying Out Pages in Layout Mode).
      
      
  • Selecting table elements
    • mouse over and click, table data will appear in properties box.
      
      
  • Using Expanded Tables mode for easier table editing
    • Expanded Tables mode temporarily adds cell padding and spacing to all tables in a document and increases the tables’ borders to make editing easier. This mode enables you to select items in tables or precisely place the insertion point.
    • Do one of the following:
      • Select View > Table Mode > Expanded Tables Mode.
      • In the Layout category of the Insert bar, click the Expanded Tables Mode button.
      
      
  • Formatting tables and cells
    • The order of precedence for table formatting is:
      1. Cells
      2. Rows
      3. Table

      For example, if you set the background color for a single cell to blue, then set the background color of the entire table to yellow, the blue cell does not change to yellow, since cell formatting takes precedence over table formatting.

    • To view and set table or table element properties:

    1. Select a table, cell, row, or column.
    2. In the Property inspector (Window > Properties), click the expander arrow in the lower-right corner to see all the properties.
    3. Change properties as necessary.
       

  • Resizing tables, columns, and rows
    • Do one of the following:
      • select and drag the selection handle in the direction you want to resize.
      • Only works from bottom or right side.
        
        
  • Adding and removing rows and columns
    • select and delete or right click and choose to add
      
      
  • Splitting and merging cells
    • select, right click and cchoose merge or split
      
      
  • Copying, pasting, and deleting cells
    • select, copy then paste
      
      
• Laying Out Pages in Layout Mode
  • In Layout mode, you use layout cells and tables to lay out your page before adding content. For example, you could draw a cell along the top of your page to hold a header graphic, another cell on the left side of the page to hold a navigation bar, and a third cell on the right to hold content. As you add content, you can move cells around as necessary to adjust your layout.
    
    
• Using Frames
  • rames provide a way to divide a browser window into multiple regions, each of which can display a different HTML document. In the most common use of frames, one frame displays a document containing navigation controls, while another frame displays a document with content.
    
  • To ensure that your frameset appears correctly in browsers:
    1. Create your frameset and specify a document to appear in each frame. Save every file that’s going to appear in a frame. Remember that each frame displays a separate HTML document, and you must save each document, along with the frameset file.
    2. Set the properties for each frame and for the frameset
       This includes naming each frame, setting scrolling and non-scrolling options, and more.
    3. Make sure to set the Target property in the Property inspector for all your links so that the linked content appears in the correct area (see Controlling frame content with links).
       
       
• Templates

• A template author designs a "fixed" page layout in a template. The author then creates regions in the template that are editable in documents based on that template; if the author does not define a region as editable, then template users cannot edit content in that area. Templates enable template authors to control which page elements template users--such as writers, graphic artists, or other web developers--can edit. There are several types of template regions the template author can include in a document.

  One of the most powerful uses of templates is the ability to update multiple pages at once. A document that is created from a template remains connected to that template (unless you detach the document later). You can modify a template and immediately update the design in all documents based on it.

• Save your file as a Template.