Learning Paths

Musings on Dreamweaver

No pun intended – this post has got nothing to do with Adobe Muse at all, but just wanted to share a few thoughts and ideas relating to Dreamweaver, as someone who started out as a Macromedia trainer and has used it since the very first version.

What is the Point of Dreamweaver?

I actually get asked this question quite a lot. I also get told how Dreamweaver training is in decline – people aren’t booking on courses for it and are instead booking on our [excellent] HTML, CSS, JavaScript, jQuery and WordPress courses instead. Well, nothing could be further from the truth – Dreamweaver is actually our busiest Adobe product by a long way (followed by InDesign and Photoshop). Each of the courses in standards-based web design uses Dreamweaver as an IDE as do any of our CMS-based courses (WordPress is the only one that runs as a public course although we do offer Joomla and Drupal on a bespoke basis).

I always use this analogy to describe where Dreamweaver fits into things – see if this makes sense to you. We have nuts and bolts, and we learn to use a tool like a spanner, to tighten and loosen them as required. We have some pretty specialised forms of nuts and bolts, like those that hold on the wheels of our cars – for those we wouldn’t get too far with a spanner (that’s wrench in American) so we use a specialised form of spanner/wrench called a wheelbrace (lug wrench in American).

When you go to have your tyres changed at the shop, however – the shop has a power-tool version of these to let the job get done quicker, and the absolute height of wheel-changing technology is found in the pits of formula one racing, where they will do the whole lot all-at-once in seconds.

That’s what Dreamweaver is like in web-development. It’s not only changing tyres, it’s doing the oil, air, water, fuel, air-con and so on. Sometimes, I use BBEdit to code. I’m increasingly using Edge Code. But while these have their uses and they are fun, Dreamweaver has it all: Code hinting for several languages (even CMS-specific tags). Snippets, Library Items, Built in FTP, Synchronisation and SubVersion. Form-based and now visual CSS helpers. All in one place – Dreamweaver is loveliness.

So Why Do People Moan About Dreamweaver?

Because people coming to the product without any HTML/CSS knowledge think it’s just going to do the job for them, like Photoshop does, or Illustrator does, with their amazing tools. To soem extent, it does have presets and some WYSIWYG functionality (feels like I’m showing my age using that abbreviation) that could be used fairly well out of the box but they are very limited. But if you think of Dreamweaver as the pit-team, it is awesome. It has its problems – the Live View renderer falls flat on its face as soon as you start using anything over elementary CSS, or if you use SVG and a couple of other things. There are also a couple of things I wish it could do – see below – and a couple of things I wish it didn’t. But you can’t really have it all, and on balance it is still the industry standard for a reason.

I Can’t make HTML Emails in Dreamweaver

Well, that isn’t true – our HTML Email course uses Dreamweaver to edit and refine what Photoshop or Illustrator have started out for us, and it does all that pretty well. Having said that, this sort of job used to be very easy in Dreamweaver until Adobe became the web-standards police and took all of the table-layout features out of the product. It’s one of the reasons we don’t get so many people asking for specific DW courses anymore – over the years about 40% (if not more) of the delegates I have taught Dreamweaver to have wanted to produce HTML Emails.

Adobe Systems – I love your company, would you mind if I offered you a bit of advice? Take all of the old Macromedia code, and repackage it for the HTML Email market – you could call it MailWeaver or DreaMail! New users would love the integration between Photoshop and this product. I know there are products that have names like those already by the way, but you could always drop a vowel | some vowels in MailWeaver to MailWvr or something down-with-the-kids like that. I don’t know. I don’t work in marketing.

 What I’d Add or Fix

The engineers at Adobe do an amazing job, and they make things happen that work so well it often seems to us as if it is easy, which I’m sure it is not. If it hasn’t come across well, then I’d like to say that I absolutely love Dreamweaver and as I teach something in it most weeks at Academy Class, it makes my job easier, and is less typing-intensive for my learners, who also benefit from less errors with their code, too. All I want do at the end of this post is just add in a few things I’d like to see – that they haven’t already done with the CC release (Media and jQuery UI in the Insert Panel!). Of course, the minute this post is published, I will remember loads of other things I think Dreamweaver could do with but it is hot at the moment, the end of the working day, I have already written over 1,000 words and I can only think of the ones I wish for all the time, so here are my suggestions:

Point to File is Great but…


It’s a bit 1995. What would be useful; is pointing to text anchors within the page I’m pointing at. Dreamweaver knows loads about the content of my pages, so would it be difficult for it to be “listening” out empty for <a> elements with an ID attribute, when I point to a file? On static sites that I build I use named anchors aplenty to link content – I can’t be the only person in the world doing that, now can I?

Make Move CSS Rules Work Properly

It is very common to develop a page style by adding the styles to the <head> of the document in <style> tags and then to export them to an external CSS document and link to that document. Dreamweaver has a function in the coding toolbar that is there to expedite this but the only problem is that it always puts the link to the external document above the closing </head> tag. That means, if you are using embedded page styles as an override to the external stylesheet that link has to be moved above the <style> tags or the chances are any styles in the document stylesheet will be ignored. Again – would it be difficult to get that function to put them above any opening <style> tags?

Revert the Insert Panel to Horizontal

As it used to be. This is my least favourite part of the interface in many ways – even though in CC they have at least got rid of the bits that have been in there since 1997 and put some useful stuff in there – mentioned above.

When it is used horizontally, it is quite useful and greta for teaching, especially when building forms, but to have a panel that you have to scroll in makes the menu system a much more attractive prospect; given that panels are to some degree there to stop you going to the menu system all the time this seems to me to be counter-intuitive. I know you can change this by dragging it into place, but it isn’t obvious to new users who would perhaps use it most – or maybe introduce a new default “Starter” workspace.

Reintroduce Command-E

This used to be the shortcut as I recall for “Save Everything” back in the day and the DW revamp of late has seen that shortcut freed up – can we have it back please. Note to self: If this wish is granted, you’ll need to find something else to do when you’re teaching creating custom keyboard shortcuts.