CBT Cafe Logo  

CBT Cafe > Dreamweaver > Basics

Dreamweaver: Using Layout View

This new feature alone is worth the price of the upgrade to version 4! This is by far the coolest way to create tables ever because it lets you create tables from a visual point of view.

I'm going to begin with a Tracing Image I created. This will show you first hand the benefit of this new feature. I created the comp in Fireworks and exported it as a .png to use as a Tracing Image. To keep file sizes down for this tutorial, the tracing image has been scaled down and therefore is not to size.

Click here to preview the lesson.

Download: Tracing Image


Obviously using a Tracing Image is not required to use the Layout View. We're just using it in addition with Layout View to demonstrate how effective the two are together.

-------

Step 1: Entering Layout View

  1. Begin by clicking the Layout View icon on the Objects Palette. You may get the Getting Started dialog box that tells you about the different modes. You can click the checkbox to not display this box again if you like.
  2. This will give you access to the Draw Layout Table and Draw Layout Cell options which allow you to create and edit tables and cells in Layout View.

Entering Layout View

Step 2: Applying the Tracing Image (Optional)

  1. Go up to Modify>Page Properties...
  2. Select site.png to for the Tracing Image.

 

Applying the Tracing Image


Step 3: Creating the first table cell

  1. Click the Draw Layout Cell icon. This will change the cursor to a cross hair cursor.
  2. Draw the rectangle over the top blue bar. Dreamweaver will automatically create the table around the cell since you can't have a cell without a table. We could have drawn out the table first but since Dreamweaver does it for us we'll let it:-)
  3. Mouse over the cell you just drew until it turns red. When it turns red, click on it to select it. You can now modify it.
  4. In the Properties Inspector, adjust the Height if necessary to match that of Tracing Image.

 

Creating the first table cell


Page 1 | Page 2 | Page 3 | Page 4
transSpacer
 

Home | Dreamweaver | Fireworks | Flash | Photoshop | Elements | PowerPoint| Ebay | QuickTime Pro | Flash 5 CD | Fireworks MX CD | QuickTime Support | Contact

Copyright © 1999-2011 CBT Cafe, All rights reserved

Flash®, Fireworks™, and Dreamweaver® are registered trademarks of Macromedia, Inc. in the United States and/or other countries
Photoshop®, Photoshop Elements® and Illustrator® are registered trademarks of Adobe Systems, Inc.
QuickTime® is a registered trademark of Apple Computer, Inc.
Ebay® is a registered trademark

CBT Cafe | Multimedia Learning | Interactive Graphics