Unless you’ve been living under a rock, you know the underlying language of the web, HTML, has begun to (finally) evolve once again with the browsers slowly beginning to support pieces of HTML5 and CSS3. With the release of Dreamweaver CS5, the world’s leading web authoring tool has made huge strides in embracing the evolution of the web, providing an unparalleled ability to style themes for any PHP-based CMS system (WordPress, Drupal and Joomla out of the box, as well as home-grown PHP-based systems). However, for those who have already upgraded and who want to leverage HTML5 and CSS3, you’ve no doubt found that the only “apparent” support for HTML5 in Dreamweaver CS5 is the addition of the HTML5 doctype in the New Document dialog. But now, that’s all changed!
During the keynote session at the Google I/O Conference in San Francisco, Adobe’s CTO, Kevin Lynch, demonstrated an extension to Dreamweaver CS5 which not only adds the new HTML5 semantic elements, but also properties for CSS3, to the authoring environment. With this addition, Dreamweaver CS5 users are provided with code hinting for HTML5 and CSS3 in Code View.
Of course, HTML5 and CSS3 are not “finished” yet, and as such, the team can’t “know” what’s going to be in the final specification. Therefore, the extension provides support for the elements and properties that are “the most complete” at this time. In other words, the elements and properties that, not only appear to be “mature” in the W3C specifications, but that are also gaining support among the browser makers. To this end, basic code hinting support is provided for these CSS3 properties specific to individual browsers (-moz, -webkit and -o).
As a page comes together from the code perspective, it’s also important that we see how that code is being rendered, and this is an area that Dreamweaver has truly shined over the last several releases with its Live View feature (an implementation of WebKit). And with the new extension, the underlying engine of Live View gets an overhaul to allow for the rendering of these new semantic elements, including the much hyped <video> and <audio> elements, along with rendering support for some of the most common CSS3 properties.
And for those looking for a little help in getting started, the extension adds a few new layouts to the CSS Starter Layouts (File>New) which have been marked up with the new HTML5 semantics.
Of course, there’s still work to be done – and rest assured, as Lea Hickman points out in an article in the New York Times, the Dreamweaver team is hard at work and laser-focused on creating the best environment for HTML5 and CSS3 development. Stay tuned for more news and updates as they become available. And if you haven’t already done so, download the Dreamweaver CS5 trial for yourself.