By: Kevin Yank

October 3rd, 2003

Reader Rating: 8

Another year, another version of Dreamweaver. The Big Question, as always: should you fork out for the update? Well, if you use CSS in your Web design work -- especially for page layout -- then the answer this year is "absolutely!"

A casual glance at Dreamweaver MX 2004 reveals that the Macromedia interface designers have been at it again. For the second version in a row Macromedia have completely revamped the look of the interface. Thankfully, the interface changes are mainly skin deep, and everything works the same way it did in Dreamweaver MX, only it looks slicker!

Looks aside, the biggest change in Dreamweaver MX 2004 is the improved CSS support. From the code editor to the WYSIWYG view, all the existing features of the program provide better and more complete support for CSS. The WYSIWYG view keeps surprising me with just how closely it emulates CSS compliant browsers like Mozilla, Internet Explorer 6, and Opera 7, and the code editor now provides complete pop-up hints for hand-coding CSS.

Complex backgrounds and borders, intricate positioning hierarchies, floats and display modes... it's all there! All but the most complex CSS layouts should appear reasonably well (if not 100% correct) in Dreamweaver's WYSIWYG view. In some cases, Dreamweaver's WYSIWYG view does a better job of conforming to the CSS standards than even the latest version of Internet Explorer!

But the real highlight of Macromedia's emphasis on CSS with this release is the Relevant CSS Panel.

With this miracle of interface design, you can instantly see all of the CSS rules that apply to the currently-selected element in the WYSIWYG or Code view. I'm not just talking about the rules that match the selected element, either. This panel shows every rule that applies to the selected element and its ancestors! This lets you see attributes that affect the selected element through CSS inheritance.

In the top section of the panel, you get a list of the rules that may affect the current element. The rules are listed in the order they apply to the element, according to the cascading rules of CSS. Click on a particular rule, and the lower section of the panel tells you where it's defined (e.g. "In styles.css", or "In current document") and lists the CSS properties that it defines. Defined properties that affect the selected element are shown in normal blue text, while those that are either not inherited properties, or which are overridden by a rule later in the cascade appear with a red line through them.

This panel isn't just for examining CSS rules, either. All of the properties in the listing are directly editable; and if you prefer to hand-code your CSS, you can double-click on any of the rules in the top half to jump straight to the relevant line of code in the main editor.

With this unique tool Macromedia seems to have unlocked the secret to working logically with CSS in a GUI. It takes a bit of getting used to if your CSS knowledge is a little rusty, but for those of us who fully appreciate how CSS works, this is truly a feature to behold.

Okay, but what if CSS isn't your cup of tea? Or what if the CSS support in Dreamweaver MX is sufficient for the way you use this technology? Well, there are lots of other new and improved features in MX 2004:

• Automatic browser compatibility checking A little icon at the top of the document area notifies you if Dreamweaver has detected any coding errors or unsupported features that may prevent your page from working in a particular browser. Click on the button, and the Results panel gives you a complete list that you can click to fix each problem in turn. This may sound a lot like the validation features of Dreamweaver MX, but this feature checks both HTML and CSS code, and can find and identify known compatibility issues with most popular browsers (not just the published specifications), including recent entries like Safari 1.0 for the Macintosh. Those of you who don't want to be notified when you use CSS properties that, say, Netscape 4 doesn't support, fear not! You can configure which browsers and versions are checked for compatibility.
• Secure FTP support This is a big one for me, since all of the SitePoint servers accept file transfers by Secure FTP only. You see, ordinary FTP sends and receives all data in plain text (including passwords!), and so it very susceptible to hacking. Secure FTP, on the other hand, encrypts all data flowing to and from the server. If you still use FTP to upload your files, now is the time to consider this secure alternative! With this new support, I can finally upload changes to my Web site without having to open a separate program, and I can take full advantage of the features in Dreamweaver's file management panel.
• Direct editing of remote files Speaking of which, there are times when you want to quickly update a file stored on a remote server without all the hassle of setting up a full Site in Dreamweaver. Dreamweaver MX 2004's Sites panel now lets you create simple FTP and network server connections in addition to full-fledged sites. With these connections, you can quickly open, edit, and update a remote file without the hassle of setting up a local directory structure to mirror the site locally.

Those are just a sampling of the improvements Dreamweaver MX 2004 has to offer. To get a full appreciation for the changes, I recommend downloading the 30-day free trial and using it in your own work for awhile. Just to satisfy your curiostity, though, here's a list of some of the more significant improvements I've noticed:

• a welcome screen that is unobtrusive and useful for experienced users
• code editor in general is more useful and powerful, including pop-up hints for ASP.NET
• PHP support is now feature-equivalent with the other server models
• integration with Fireworks lets you to perform simple image editing tasks inside Dreamweaver
• XML editing improved with XML namespaces support
• pasting from HTML-aware programs including Microsoft Office applications preserves formatting
• updated version of HomeSite+ included

The Big Question

So, back to the Big Question. As you can see, there is plenty of meat to this new version, but the biggest changes are most definitely in the area of CSS support. If you're not going to benefit from those features, then the $199 price tag for the update is probably a bit much for what, when it comes down to it, is an evolutionary step forward in most areas of the product.

But if you use CSS to format your sites, and especially if you use or were hoping to take up CSS page layout, then this is an indispensable update. Get it now and never look back!

Product Name: Dreamweaver MX
Company: Macromedia
Price: $399.00 ($199.00 upgrade)
30-day trial download available: http://www.macromedia.com/software/dreamweaver/ [1]

[1] http://www.macromedia.com/software/dreamweaver/