Dreamweaver CS4 Goes “Live”

Improving the Properties panel?

I can tell Adobe is committed to improving CSS usage, because with every version of Dreamweaver the company adds something to revolutionize the application of CSS rules. Dreamweaver CS4 sports a new Properties panel that is split into two modes, HTML and CSS, which basically separate the functions that the previous Properties Inspector already had. Moreover, the bottom half of the Properties panel has plenty of space in both modes so I think splitting it into two modes was not very smart—HTML and CSS options can and should be viewed at the same time, but there is no option to do so.


Dreamweaver CS4 Properties inspector

Here you can see both panels in the Properties inspector.

Since CSS is designed to be cascading, I have started getting in the habit of creating generic rules and applying multiple rules to elements to get the desired effects. Dreamweaver’s interface has never allowed this and still doesn’t. What the new Properties panel does do for CSS is allow some options for quick and easy rule creation (via the pre-existing New CSS Rule dialog box), modification and specificity, which I like. Even better is the fact that you can modify pre-existing HTML tags with the CSS Properties inspector, including heading and paragraph tags. These new features in the Properties panel are helpful tools for drilling down into CSS code quickly, but it’s still no substitute for knowing how to write good CSS code.

Data is a snap!


Dreamweaver CS4 data sets

I admit that I am a web designer first and a developer second—I am not an expert programmer and I usually partner with developers for my freelance work. The worst part of this deficiency is that a database is not much more than a table of information, which I or anyone else can handle. Dreamweaver CS4 has a new Spry widget called Spry Data Set, which will convert a HTML table into a dynamic database and HTML page to display it with Ajax functionality. It’s easy to process, and Spry allows for sortable columns, a master-detail layout and other display modes. You can also process XML data and render data from RSS feeds and various other sources, which is outstanding. This is an easy method for database creation and deployment, and there isn’t much excuse left for not handling dynamic data. Live View comes into play once again with Spry data sets: you can change the data on the page, and Dreamweaver CS4 will automatically update the page in Live View mode for easy testing.

Working with external files: SWF and PSD

There are new features for working with two important Adobe file formats, SWF and PSD. In the case of SWF, Dreamweaver CS4 creates XHTML-compliant code and creates the scripts necessary to use it properly for major browsers. The application uses SWFObject 2.0, which Adobe tells me is the de-facto standard for embedding Flash, but I tested it and found that the code created by the application is compliant for XHTML 1.0 Transitional but not XHTML 1.0 Strict or XHTML 1.1. The upcoming HTML 5 will comprise both XHTML and HTML code so this may be a moot point eventually, but HTML 5 will not reach Recommended status for a long while. The script is also 670 lines long, which seems excessive. The saving grace of the SWF improvements is the fact that, if it’s not installed, the webpage can be set to install Flash Player on its own. This is both very convenient (for designers) and very scary (for users), but it does work so I will allow users to pass their own judgment.

Dreamweaver CS4 now allows Photoshop files (PSD) to be placed and optimized within Dreamweaver and retain its link to the original, similar to what happens when an image is placed in InDesign. When the original is revised, Dreamweaver CS4 shows an icon to alert the user the image needs to be updated, which is done from the Properties panel. This feature works as advertised and I am very happy to see this happen—I’ve wondered for years when Dreamweaver (which is fundamentally a layout application) would catch up to InDesign (another layout application) with dynamic links to its image assets.

InContext Editing: What about Contribute?

One of the last new features in Dreamweaver CS4 is InContext Editing, which allows webpages to be editable from a web browser. The procedure, which is similar to that used by most content management systems, involves creating editable regions and limiting what users can change (the Properties panel can limit what formatting users can and cannot do) and then setting up the user as an InContext Editing user. Once the user is registered, he/she can change the pages as needed.

I am all for these kinds of lightweight content management systems—sometimes this is all users need for the bulk of their website revisions. Too many times, I’ve been hired to design a website with a complex content management system that doesn’t get used much. However, Adobe already has an underrated content management application—Contribute, which was upgraded to CS4 and is included in the Web suites. Where does Contribute fit into the Dreamweaver—InContext Editing paradigm? Is Contribute on the way out, or do they serve separate needs? Ironically, Contribute also comes with plug-ins that allow user editing from a web browser, just like InContext Editing. I’m unclear what the future holds for this content management technology.

Conclusion

Dreamweaver CS4 is a very nice upgrade, with strong new features such as Live View and Spry Data Sets. Dreamweaver CS3 was the first iteration of Dreamweaver as an Adobe application, but I think CS4 is when this and other Macromedia apps have really hit their stride. There are still some things to be improved upon, and there are some improvements in CS4 that I could live without, but when clients and designers ask me if CS4 is a worthwhile upgrade I point to Dreamweaver (and InDesign) as proof that the value is there.

Adobe Dreamweaver CS4
Adobe Systems
US$399 full/$199 upgrade
Rating: 9/10