Dreamweaver CS4 review
When Dreamweaver ousted GoLive as Adobe’s web design application, it wasn’t asquick off the mark as Flash to adopt the Creative Suite interface.
It was a surprising omission for a core application in the Web bundle, but it has finally caught up and now sports the suite-wide CS4 look and feel.
It’s a big benefit for Dreamweaver, whose interface is busy with palettes and tabs, which take up valuable screen space and previously only collapsed vertically. Now they can be reduced to icon size and called on only when you need them.
In terms of features, this release isa big overhaul when it comes to keeping track of files. If you already use Dreamweaver, you’re bound to have opened many HTML, CSS and other file types alongside each other, making the tab bar very cluttered. This has changed dramatically, although Adobe’s solution is actually very simple.
Open a file that calls upon style sheets orscripts and a second tier is displayed beneath the tab bar. The related files bar displays links to these files, rather than opening them as a new tab. The practical benefit is that you can keep track of site structure and quickly see whether the necessary files are linked.
The related files bar appears when youopen files other than HTML, too. Dreamweaver also handles PHP include statements, for example. Hitting F5 refreshes the bar so that you can access newly linked files quickly without digging around in the Files palette.
Getting around your site is also easier with better CSS management. Hovering over an element on a page and holding down Altand Command brings up the Code Navigator, a window that lists the name of every style affecting it. Roll over one and its definition appears as a tooltip and, once you’ve worked out the source of a problem, clicking on the style name takes you directly to the rule to edit it. This is a huge improvement that makes it far simpler to get to the root of a problem. This and the related files bar reduce the burden on the tab bar, which used to get so crowded that finding the right file and line of code was nigh-on impossible.
Next to the code and design view buttons is Live View, which renders in the WebKit engine that’s used in a growing list of notable browsers, including Google Chrome and Android. Live View provides an interavailable, rendered site within Dreamweaver, but you’ll still need to check in a proper browser that uses a different rendering engine. This isn’t Live View’s real purpose which is to help developers to work with dynamic content, alongside the Live Code feature that shows acode view alongside.
This should take away some of the mundane mental work of dealing with dynamic content; you can see how source updates when CSS rules are applied or Ajax amends the page. It also works in conjunction with the Code Navigator to make quick changes to style sheets. Roll over an element in Live View, for instance, and you can call up the amended rollover styles, for instance. Locate the element in Live View, freeze theJavaScript engine and use the Code Navigator to quickly make a change and see the results without leaving Dreamweaver.
However, the exact changes to the page aren’t always obvious as the only visual clue is the shifting of code, and the view doesn’t jump to the change if it lies elsewhere in the file. You can manually work around this by making a selection in the Live View pane, but complex scripting can have disjointed effects that update multiple tags.
The JavaScript engine can be paused toinspect code as if it were static, and LiveCode makes inroads to inspecting dynamically generated pages. However, it lacks automatic highlighting of tags changed between page states, along with navigation to jump between them.