VERDICT: Improved CSS handling, browser compatibility checking and especially the new Ajax support make this the most significant Dreamweaver release for years.

Dreamweaver has dominated the world of professional web design in the decade since Macromedia first introduced it. Recently however there has been growing concern that it has been trading on past glories...

With Adobe’s takeover of Macromedia there was even the possibility that it might be replaced by Adobe’s own GoLive. Thankfully that’s not the case and instead it’s GoLive that’s gone with Dreamweaver now central to all Adobe’s CS3 web offerings.
With GoLive’s demise, Dreamweaver’s biggest rival has been removed - but another has taken its place. Moreover, where GoLive’s inherent bloat ruled it out as a serious threat, the new Expression Web from Microsoft is the model of streamlined efficiency. Which makes it all the more disappointing that Adobe hasn’t extended its new CS3 cross-application interface to Dreamweaver CS3 – surely this should have been a priority for such a flagship application?
The recently launched Expression Web also scored over Dreamweaver with its recognition that modern web design is now completely defined by efficient CSS handling. Here, Dreamweaver CS3 has risen to the challenge and borrowed a number of features from its new rival. To begin with, when you create a new page, you can now base it on one of a wide range of templates based on CSS-positioning rather than HTML tables while new visual aids make it easier to work with the layout’s DIV building blocks. CSS-based formatting is also easier now thanks to the consolidation of previously separate palettes in a single unified CSS Styles panel, a new toolbar that lets you swap between CSS media types, and the ability to move internal styles to and between external style sheets.

Dreamweaver CS3's core CSS handling has been improved

Despite Dreamweaver CS3’s improvements, Expression Web’s CSS handling just edges it for efficiency and usability (see separate tutorial), but that’s by no means the end of the story. Ultimately what really counts is that page designs should work in practice out in the messy real world. Here the fact that Dreamweaver provides an in-built CSS reference complete with information on browser support is invaluable. Even more useful are the necessary workarounds to known browser issues that Dreamweaver CS3 automatically adds to its template-based pages. Complete with explanatory comments and best practice suggestions these are a real education – and worth their weight in gold.

The real proof of just how serious Adobe is about helping users create CSS-based designs that work as expected wherever they are viewed is its new Browser Compatibility Check. Here you can target particular versions of Internet Explorer, Firefox, Netscape, Opera, Safari, even the old Mac version of IE and any items on the page which might cause problems are automatically highlighted. The problems isn’t just highlighted, a link is provided to Adobe’s new CSS Advisor site where you can see if an end user has posted a workaround solution. Compatibility checking doesn’t entirely replace trying out your designs under different browsers – but it’s a huge step forward. Moreover, while Expression Web boasts of its compliance with the core (X)HTML and CSS standards, Dreamweaver CS3 trumps it by recognizing that it’s not just the standards that matter – but how these are supported by the main browsers.

Dreamweaver CS3 does all that it can to ensure that a CSS design will work with all browsers

Dreamweaver CS3 also leaves its new rival standing with its much wider support for standards such as PHP, JSP, ASP and ColdFusion. With this latest release it further extends its range with support for the popular and powerful new Ajax (Asynchronous Javascript And XML) standard. Actually Ajax isn’t really a new standard at all but rather a new way of getting existing standards - Javascript, XML, XHTML and CSS - to work together. In particular it enables pages to react dynamically without requiring the page refresh which has long defined - and hindered – the whole experience of web browsing.
The benefits of Ajax are clear and modern sites such as Google Maps, Yahoo and Flickr show just what a difference it can make to the end user experience – but as anyone who’s tried to add some Ajax magic knows it can be fiendish to implement. Well not any more. Dreamweaver CS3 offers a new “Spry framework” which makes it child’s play to add Ajax – in most cases you simply drag and drop a Spry “widget” onto your page. Within your code the structure of each widget is handled by simple HTML which can be edited with the Parameters tab of the Properties panel. To control the widget’s appearance you can customise a dedicated external CSS stylesheet while the really clever bit, the widget’s behaviour, is handled by an external Javascript file that you shouldn’t even need to touch.

The implementation is simple but what exactly does Adobe’s Spry framework let you do? There are options for validating form elements such as option boxes and text areas so that you can check that end user data input meets certain criteria as it is entered – no more blanket form rejections because it wasn’t filled in correctly. There are also five options for live data handling via XML so that you can, for example, add an interactive product listing table that can be sorted without the need for a page refresh. When used in conjunction with a Spry “detail region” you can also set product details and an image to elsewhere appear elsewhere on the page when a product is selected.
Perhaps the most regularly useful Ajax-based options will be the new user interface components. With the Menu Bar widget you can add navigational menu buttons that display submenus when a site visitor hovers over them. With the Collapsible Panel you can hide and reveal content by clicking on the panel’s title. With the Tabbed Panel you can display multiple panels one at a time, which is just what the Accordion widget does too though here the tabs are arranged vertically. In all cases the Ajax works to make a large amount of information more accessible and manageable and puts the end user in control of it.

Dreamweaver CS3's Spry frameworks makes it simple to add Ajax handling to your pages

Finally for good luck Adobe throws in a range of Spry-based effects. These are accessed from the Behaviours panel rather than the Insert menu and are designed to let you add visual transitions to elements – for example making them grow, shrink, fade, highlight, squish and so on. This might smack of the bad old days of OTT DHTML but, used sensibly, they can give a page a lift, draw the end user’s attention and, by making the page more dynamic, make it more involving – in short make it better designed. This is true of the Spry framework generally and, there are few sites that couldn’t benefit from some Ajax-based dynamic design.
That’s about it for new internal power but, as always, Dreamweaver benefits greatly from its supporting applications. If you’re buying it as part of one of the CS3 Web suites that includes the tight integration with the latest Contribute and Fireworks (see separate reviews). Integration with the latter has been greatly improved with the ability to paste copied objects directly into Dreamweaver whilst maintaining the link to the original so that you can quickly edit it and then paste back the new version with all optimisation settings intact. If you buy either of the Premium editions of the Web and Design suites the same capability is offered with the bundled version of Photoshop CS3 Extended. And even as a standalone application, Dreamweaver now includes a copy of Bridge CS3 to take care of media management while the new Device Central CS3 (see review) lets you see what content will look like on a wide range of mobile devices.
Over recent years Dreamweaver has been allowed to idle as Macromedia concentrated on Flash as the best way to enhance the end user’s web experience. With Dreamweaver CS3, Adobe has rightly put page-based authoring back centre-stage.

EASE OF USE 4/6
FEATURES 6/6
VALUE FOR MONEY 5/6
OVERALL 5/6