Dreamweaver 4 Overview

Introduction to Dreamweaver 4


1  Dreamweaver 4 Overview
2  The Interface: Same, but Different
3 Handling Code
4 How Buggy Are Your Scripts?
5 Inserting Flash Objects in a Flash
6 Handling Images
7 Site Management: All Together Now
8 Hits and Misses
Home Tired and Want to go HOME

Dreamweaver 4 Overview

Page 2 — The Interface: Same, but Different

Your first impression of Dreamweaver 4 will probably be that not much has changed (on the surface at least). Yup, it's got that same "floating panel" interface that we've all grown to know and love, and all your old friends are there: the Object panel, the Properties panel, the Launcher panel. In fact, Macromedia has taken the floating Object panel and integrated it into its core suite of Web media development applications, so if you work in Flash, Dreamweaver or Fireworks, you only need to familiarize yourself with one common Object panel interface. Pretty nifty.


The Objects panel has all of the standard buttons found in older versions -- insert image, insert table, insert horizontal rule -- along with a handful of new, fancy tools that you can use to insert Flash and Fireworks elements into your page layout. These tools follow Macromedia's strategy of seamless integration between their core apps, and they can make adding multimedia elements to your pages a total breeze. (We'll go over these features in depth when we look at the multimedia features of Dreamweaver 4.)

The Object panel has two new buttons that help you design the basic layout of your Web pages: Layout view and Draw Layout Cell. By choosing the Layout view option, you can get a precise view of how your page will appear when viewed in a browser. This is as close as Dreamweaver 4 comes to true WYSIWYG capability, a vast improvement on Dreamweaver's previous table handling capabilities. Much like in a desktop publishing application, you can automatically set your page width and height to whatever static size you'd like.

The Draw Layout Cell tool is basically just a super-charged table creation tool.

Once you draw a rectangular box in Layout view, Dreamweaver creates a table, displays a tracing box around the table and displays the pixel width and layer information directly in the Layout window. This makes it easy for you to watch the pixel dimensions while you resize the table, move elements around inside the tables and merge cells to create nested tables.


The array of tools in the launcher panel also has a new addition, something called the Asset panel. Clicking on the Assets icon in the launcher opens the Assets panel. This panel gives you a complete menu of the common media elements that you use across all of the pages on your site. All of your images, colors, referenced URLs, scripts, Flash elements, QuickTime movies and Fireworks graphics are sorted into separate navigatable trees. Once you browse through your asset library, you can grab an element, drag and drop it where you want it to appear on your page layout, and Dreamweaver handles all of the linking and manages your code.

Speaking of code, let's take a look at the first area that Macromedia has overhauled to bring us the newest Dreamweaver experience, the HTML and Code View functions.

next pagenext page »