Taking Dreamweaver into the lions’ den

Last night, the good folks at London Web Standards allowed me to take the floor for a five-minute “lightning talk” to demonstrate some of the new features of Dreamweaver CS5.5, which had been officially announced only 14 hours earlier. It was a daunting task, because I know many professional web developers say they wouldn’t be seen dead using Dreamweaver. Moreover, everyone had come to hear Rob Hawkes talk about developing online games with HTML5 and JavaScript, and Seb Lee-Delisle demonstrate his amazing JavaScript skills. They weren’t there to hear about a product they probably don’t use.

Things didn’t go quite to plan. I had lined up a series of quick demos to show off the way Dreamweaver handles media queries and the creation of rounded corners with the CSS3 border-radius property. Unfortunately, the connection to the projector switched the resolution on my laptop to something crazy like 640 x 480, making it impossible to see the full workspace and preventing me from accessing the document tabs to switch between the demo pages I had prepared. Since I had only a five-minute slot, I decided—perhaps foolishly—to soldier on rather than waste valuable time trying to find a resolution compatible with the projector.

What I did manage to demonstrate was Dreamweaver CS5.5’s support for web fonts, creating and adjusting CSS3 drop shadows visually, jQuery code hinting, and PhoneGap integration. While demonstrating the support for web fonts, I was able to show how you can work in the underlying code and view the result in Live view without needing to save the document or round-trip to a browser.

I got the feeling that the audience remained sceptical about Dreamweaver, but they listened to what I had to say. And with plenty of questions, my original five minutes extended beyond ten. Matt Lucht has given a good summary of what I had to say (together with comments about the main speakers). Matt makes the comment “I’m not sure what value it gave over say a browser plugin such as Firebug.” It’s a fair point. Dreamweaver is an IDE for HTML, CSS, JavaScript, PHP, and other web-related languages, all of which are open standards. Therefore, there are plenty of authoring tools around—some free, others commercial.

What I think Dreamweaver has to offer is the way in which it brings the various web technologies together. I use Firebug and similar tools, such as the Web Inspector in Safari. They’re great, but you need to switch from your IDE and back to use them. Each time you switch is time wasted. Dreamweaver gives me most of the tools I need in a single workspace. Working recently with a jQuery Mobile project, I found Dreamweaver’s Live Code one of the most useful features. It lets you inspect the dynamically generated code inside the Document window, which is essential for dealing with pages generated through DOM manipulation. Yes, I can get the same information by right-clicking in Safari or Chrome and selecting Inspect Element, but it takes me longer to do so. Live Code also lets me inspect what’s happening in response to different events by highlighing all changes in a different colour.

Judging by comments from the audience and in conversation afterwards, there seem to be two main barriers to acceptance of Dreamweaver among professional web developers/designers. The main complaint is the price. I can’t do anything about that, although I have told Adobe on more than one occasion that I think the price differential—between what you pay in dollars in North America and what you pay in pounds or euros in Europe—is totally unjustifiable, particularly for a product that is delivered electronically. Adobe is not alone in charging a premium outside the USA, but it builds up resentment and damages sales. Still, buying software is a business expense. Business must be really bad if you can’t afford the tools for the job.

That brings me to the other main barrier—many web professionals don’t think Dreamweaver is the right tool for the job they’re doing. Maybe they’re right. Far be it from me to question how another person does his or her job. But several people in the audience admitted that they hadn’t used Dreamweaver for a long time. I have used it consistently since Dreamweaver 3 (about 11 years). The Dreamweaver of yesteryear is not the program it is today.

In 2001, the Web Standards Project (WaSP), led at the time by such people as Jeffrey Zeldman, formed a task force to pressure Macromedia (the original creators of Dreamweaver) to improve the standards compliance and accessibility of pages created with Dreamweaver. The initial result was the release of Dreamweaver MX 2004, which produced much cleaner code. It wasn’t perfect, but it was close. The main problem was Layout Mode, a WYSIWYG tool that produced the most horrendous table-based spaghetti code. Another problem was the use of “layers”—absolutely positioned elements with inline styles. With the help of others, I privately lobbied Macromedia and then Adobe to get rid of Layout Mode. Partial success was achieved with the release of Dreamweaver CS3 in 2007, when access to Layout Mode was deliberately hidden. Then, in 2008, Layout Mode was finally killed off in Dreamweaver CS4. Layers also disappeared. You can still create absolutely positioned elements, but they no longer have inline styles.

The WaSP Adobe Task Force was wound up in 2009, but Stephanie (Sullivan) Rewis still acts as WaSP Industry Evangelist to Adobe. I know from my participation in private Adobe forums that she gives the Dreamweaver engineering team a tough time, pressuring them constantly to improve standards. Dreamweaver certainly hasn’t stood still. It has full code hinting support for HTML5 and for CSS3 modules that have reached a reasonable degree of stability. Its support for PHP and JavaScript code introspection has greatly improved its usefulness to developers.

As I see it, Dreamweaver’s main problem is one of perception. It gained a reputation (deservedly so) for producing bad code and for being a WYSIWYG tool. The WYSIWYG image is completely wrong. Most Dreamweaver users that I know work in Split view with the code on the left of the screen, and a visual representation of the page in Design view on the right. If you’re working in Design view, you can keep an eye on the code that’s being generated. But it gets better if you switch into Live view, which renders the page using the WebKit browser engine. You can continue working in the code, and your changes are immediately reflected in Live view by pressing F5 or clicking the refresh icon. What’s more, the Related Files toolbar gives you access to all linked files in Code view. So, I can work in an external JavaScript file while keeping the web page visible on the right of the screen.

If you haven’t used Dreamweaver for a long time, give it a try when CS5.5 is released in May. There will be a 30-day free trial. As long as you’re willing to explore its features, I think you might find there’s a lot to like. If it doesn’t match your needs, fine. But at least I hope you’ll get the chance to see that it’s not Dreamweaver that produces bad code. It’s bad designers/developers who do.

(Disclosure: I’m not an Adobe employee, but I am an Adobe Community Professional, a sort of unpaid evangelist for Dreamweaver. I write books about Dreamweaver and answer questions in the Dreamweaver Help pages. I also teach Dreamweaver and write books about PHP.)

This entry was posted in AJAX/JavaScript, CSS, Dreamweaver. Bookmark the permalink.

7 Responses to Taking Dreamweaver into the lions’ den

  1. willis reed says:

    I love using Dreamweaver and can’t wait to use CS5.5 but I do have a question.
    Will the update be an update for CS5 owners or will there be a fee?

  2. David Powers says:

    CS5.5 is not a free upgrade. As far as I know, the only exception is if you buy CS5 between the announcement date (11 April) and the date CS5.5 becomes available in early May. However, you would need to check directly with Adobe about its free upgrade policy.

    If you bought Dreamweaver CS5 before 11 April, it costs $119 to upgrade to CS5.5 in the USA. To upgrade from Dreamweaver 8, CS3, or CS4, it costs $199. Different prices apply in other parts of the world. By way of comparison, it cost $199 to upgrade from CS4 to CS5. So, the $119 upgrade price reflects the shorter time between versions.

  3. I don’t use dreamweaver CS5 anymore; it’s too complicated for me. And there are also alternative programs.

  4. David Powers says:

    Dreamweaver isn’t the right program for everyone. I see that you created your website using WordPress and Artisteer. If that does the job for you, fine. The audience I was speaking to builds websites from scratch, writing their own HTML and CSS. I don’t think they would find Dreamweaver too complicated.

  5. Dana Pride says:

    David, thank you so much for all the expertise you share! I have been creating and maintaining websites using Dreamweaver and I love it! I started off coding in html, moved to Claris Home Page and then to Dreamweaver, so I have a good background and have been moving up in the versions, always impressed and amazed at what it has been able to do. I now use CS5 and I have just been learning about all the great new features. I love working in split view (on my 27″ iMac monitor) so I can easily go between designing and coding, with instant results showing.

    I just went through your tutorial on this page: http://www.adobe.com/devnet/dreamweaver/articles/dw_html5_pt3.html (I had earlier done parts 1&2) and now I can add alternate style sheets for my websites — I am so excited! It taught me exactly what I need to know.

    I wanted to leave a comment on that page, but (this happens every time on the Adobe site) I got an error message when trying to create a screen name. So I followed link after link until I found a spot where I can thank you.

    Thank you, and God Bless you! Keep up the excellent work!

  6. This is good article and I personnely do recommend that the Dream weaver is the best tool for professionals and they may debug easily from it.

  7. Louis says:

    Thank you Dave! I have many of your books and appreciate your contribution to learning and fun!!

    I started as a ” hand” coder using only a text editor and then discovered Studio 8. I’ve bee using DW ever since and love it. CS5.5 is wonderful and it helped me migrate my piano studio over to HTML5

    Thanks again for your work.