Create websites from the comfort of your own home!

February 13, 2008 5:07 PM

What's the best way to learn Dreamweaver at home?

I am a graphic designer working mostly with print, but obviously am a little behind the times. I want to learn Dreamweaver. My immediate goal is to do single html pages (e-newsletters etc.), rather than whole websites.

How? I am looking for specific tutorial book recommendations, or online tutorials, or whatever. How did you learn Dreamweaver? Why did or did you not think that method was great?

posted by clh to computers & internet (26 comments total)

I don't think you should learn Dreamweaver....if you want to design static, one-page sites, you just need your Text Editor and CSS.

I'd start with any CSS tutorial to get you started. If you code the site by hand, you'll get a much better feel for what's going on and it'll be a better jumping off point later.
posted by unexpected at 5:14 PM on February 13, 2008 [1 favorite]

I learned Dreamweaver in college, which is the best way to go. Being in the classroom and following along (and especially racing to get the final website project done), really helped to galvanize what I was learning.
posted by JaySunSee at 5:15 PM on February 13, 2008

I learned from the application's own documentation. It's quite adequate.
You also need to learn HTML & CSS. Those are the actual technologies you'll be working with.
posted by signal at 5:17 PM on February 13, 2008

Ah...I was once in your boat. I self-taught myself GoLive while re-vamping a design client's website.

First, get a good, easy to understand book. I highly recommend this one. Read it. Look up things you've seen or heard. Every time you run across a term you don't understand, go back to the book and look it up.

For me, the best way to go about it was to download a webpage you like...code, images, stylesheets, etc...and open it in GoLive. Then go about dissecting the code. Remove something and see what effect that had. Eventually, tackle rebuilding the webpage. Make it better. Or, at least, try making it validate cleanly.

Have fun!
posted by Thorzdad at 5:18 PM on February 13, 2008

I second unexpected. I do use Dreamweaver sometimes at work, but generally only in code view. It would be useless to me if I didn't know HTML & CSS.

You'll be surprised. The learning curve is less than a lot of people think. Look for some CSS tutorials.
posted by brundlefly at 6:17 PM on February 13, 2008 [1 favorite]

I do weekly e-newsletters for my company, and know Dreamweaver. However, I'd recommend that you start off learning HTML first. Assuming that you plan on emailing the e-newsletters there's some pretty big quirks emails have that knowing HTML (and CSS) will help you address (and that are ignored by Dreamweaver).

Most web design classes that I know of will start you off writing straight HTML without using Dreamweaver at first for similar reasons. When you try learning Dreamweaver first, you end up having to learn two different things at once.

The best source (online) that I've found for learning HTML is W3schools. I use it when ever I need to look up an attribute or other piece of HTML/CSS/whatever.

That said, the most useful thing for me for learning Dreamweaver was taking a class. It's really powerful if you know what all the features are and how to use them, and a good teacher really tells you how to use Dreamweaver for its full advantage. I have several of the learning Dreamweaver books and none of them were as helpful as a teacher.
posted by drezdn at 6:24 PM on February 13, 2008

Dreamweaver itself is not what you need to learn. It is just a very fancy editor. What you want is to learn HTML and CSS like everybody else has said.

Some pointers:
Email HTML/CSS is different than Web Page HTML/CSS, due to crappy rendering engines in some email clients (Outlook 2007 uses Word to render HTML, and not IE, which at least has standard ways of doing things). Because of this, normal (good) advice like using divs for layout instead of tables don't apply. It simply won't render correctly. Be sure to test well.
posted by cschneid at 6:29 PM on February 13, 2008

If it were me, I'd check out the local library (Los Angeles Public Library lists more than 100 results for a search on "Dreamweaver" for various interests, learning styles, and levels of experience) and download the trial version of Dreamweaver.

I also find it really helpful to have a specific project to work on when I'm learning something. Do you have friends in a band who could use a website, or an interest of your own you'd like to create a site for?

I agree with unexpected - it's great to be able to work directly with the HTML and CSS.
posted by kristi at 6:32 PM on February 13, 2008

Definitely learn HTML. Seconding W3Schools. Spend a good day learning HTML, and you'll be set for life (do read the XHTML section though). Then spend a few days learning the basics of CSS.

As far as learning to use Dreamweaver, check out the Lynda videos (free trial, or use alternate methods).
posted by fleeba at 6:32 PM on February 13, 2008

It would be best to learn html, but you can do that and get started in Dreamweaver too at Lynda.com. The online trainings are great, and the subscription includes training videos on most all related programs.
posted by TDIpod at 8:26 PM on February 13, 2008

Hopefully a library will be able to help you out with some books. Get a design themed book which has chapters based on projects and follow the steps. Hopefully what you are doing will start to gel. Focus on HTML and CSS for starters.

Plenty of resources on the net but I found that a project based book the best way to get started, and a Dreamweaver specific one will help you pick up some tips for the program that will save you plenty of time over hand coding.
posted by Tixylix at 9:38 PM on February 13, 2008

Agreeing with some of the comments above. I started out coding in Notepad and pretty much laughed at anybody that suggested Dreamweaver. For the next couple years, I only used text based editors. It was only last year that I realized that Dreamweaver has some great options in it. I still use Code View mostly, but it is nice to be able to view the results in Dreamweaver's Design View. The auto-complete comes in handy sometimes, and so does the ability to click on text, or anything really, in Design View and have it selected and focused in Code View. I honestly don't know a lot of the advanced options in Dreamweaver, I only use a very select mix of the features (auto-complete, ftp, templates, color-picker, etc.).
posted by B(oYo)BIES at 9:58 PM on February 13, 2008

Ugh... really?? Handcode everything? That seems soo counterintuitive to me. I am a designer. I design visually, not with words. Tell me why your way is better?? (not being snarky, I really don't get it)
posted by clh at 10:05 PM on February 13, 2008

Sorry. I was not saying that my way was better at all. It is just my way. Sorry it was not the input you were looking for. I am sure some of the advice above mine and the advice to come below will better fit your way.

(being a little snarky)
posted by B(oYo)BIES at 10:08 PM on February 13, 2008

Nth-ing the CSS tutorial route. I only use graphical html editors when I'm dealing with text formatting. Otherwise, it's just CSS tinkering in notepad. Especially if you've got a background in print layout, like me, you'll appreciate the control you get with CSS. Also, learning to think in terms of CSS structure will set you up for other technologies like PHP and XML. Learning only the WYSIWYG way to make a webpage is going to limit you. (It's like trying to do proper layout in ms word)
posted by cowbellemoo at 10:20 PM on February 13, 2008

@B(oYo)BIES: Read the advice above... pretty much everyone says learn to handcode. And you're all probably right... I just want to understand WHY you are right.
posted by clh at 10:28 PM on February 13, 2008

I'm a more visual person re-learning web stuff after a couple of years, and I use Dreamweaver. This is what I think the handcoders are getting at: it's mostly useless in the design view. The design view isn't going to let you see, say, how elements scale to different window sizes (or if they don't), and other things just look generally wonky (but not necessarily all the time.) Fun! I can look at code and know what's going on, but I make a lot of changes in the CSS attribute panels, too. I can't really be bothered to remember all the semicolons and brackets and whatnot. I tend to change some stuff, preview in browser, repeat.

So people are telling you to handcode because to make a good website you're going to have to know what the code is doing. But you can probably kinda fake it with a combination of the WYSIWYG elements, the resources/help files in Dreamweaver, and w3schools. For the simple things you want to do, you'll be fine.
posted by ruby.aftermath at 11:21 PM on February 13, 2008

clh, I'm in the exact same boat as you. I wanted to use dreamweaver, it felt visual, nice, safe. But when you use it in design mode without understanding the code behind it, the code ends up a sloppy, slow loading, incomprehensible mess. Dreamweaver tends to do things the hard way.
So, after working with dreamweaver, and not being able to fix the sloppyness because I couldn't understand the code, I sat down and did a few HTML tutorials, and a few CSS. I promise you, once you've spent a few hours mucking about in code, it will start to feel natural.

As far as being a visual person, you can have your website/email up in a web browser, change the code and then hit refresh on the page. You see the results of your actions as you do them. I couldn't imagine having to code a whole website without looking at it as i coded it.
posted by JimmyJames at 11:23 PM on February 13, 2008

I also started with Dreamweaver and then got frustrated when it wouldn't do what I wanted, so I (like many above) did the HTML and CSS online tutorials at W3Schools, and realized that the problem with Dreamweaver is that it makes things much more complicated than they need to be, and turns out messy, clunky code to boot, plus something which works in one place will stop working somewhere else, and if you don't understand the code, you can't figure it out. I'm a visual person too, but really, it took about a week to be able to turn out respectable-looking basic HTML & CSS, and I found that it was actually much more intuitive (and rewarding) to just handcode once I learned the basics of coding than Dreamweaver ever was.
posted by biscotti at 5:24 AM on February 14, 2008

I just want to understand WHY you are right.

Because regardless of what program you use to create webpages, in the end they're HTML + CSS (and maybe javascript, etc).
Trying to use Dreamweaver without understanding HTML & CSS is like trying to use Photoshop without understanding pixels & colors. Yes, you will be able to achieve some kind of result, but you won't understand what's actually being done, do anything non-standard or be able to fix it when something breaks.
And you can use Dreamweaver in CODE+WYSIWYG mode, so you can immediately see the results of the changes to the code (sort of, you still need to test in like 8 different browsers).
posted by signal at 6:05 AM on February 14, 2008

"Ugh... really?? Handcode everything? That seems soo counterintuitive to me. I am a designer. I design visually, not with words. Tell me why your way is better?? (not being snarky, I really don't get it)"

The web (at its best) isn't a purely visual medium; ideally the HTML provides the content and structure, and CSS then lays design onto that. It's never a complete separation, but if you approach the web just as visuals then you'll probably produce sites that are less accessible, less search-engine-friendly, etc. and also miss what the medium's really about.

And once you reach a point where the quality of construction really matters (e.g. producing templates for a server-side programmer to integrate into a CMS), hand-coding is actually a lot easier than poking around a WYSIWYG tool trying to understand things you can't immediately see.
posted by malevolent at 7:46 AM on February 14, 2008

Thanks y'all. This is what makes Mefi great IMHO. I asked a question, expecting a particular set of answers, only to discover I was asking the wrong question. This weekend is Presidents Day, and I'm going to spend my three day weekend learning HTML/CSS. You convinced me. Thanks for ALL the answers.
posted by clh at 10:36 AM on February 14, 2008

I hope you’ll report back when your weekend’s over, clh. I’d be fascinated to hear where you find yourself with your project after three days of code tutorials.
posted by dpcoffin at 11:54 AM on February 14, 2008

Another vote for hand coding.

Here's what I always say about Dreamweaver and other such tools -- they're like spell-checkers.

Spell-check is only really good for people who can already spell. If you've typed "thier" it will correct it to "their". Which is no good if you meant "they're".

So once you know what's going on in HTML/CSS, use Dreamweaver by all means. But if you don't, you're just getting a false sense of security.
posted by AmbroseChapel at 3:39 PM on February 14, 2008

Still looking forward to hearing how your week-end crash-course in code is going. In the meantime, as one relatively code-free designer to another, I suggest you consider these two DW alternatives that I’ve used happily to create simple html pages and newsletters:

1. SiteGrinder. It’s a Photoshop plugin; you design exactly what you want using PS, create and name your layers as required by the plugin and described quite well in the docs and online video tutorials, hit Go, and out comes a web page. You can get quite complex with it, so that whole websites emerge. Slick.

2. Constant Contact. Elegant and easy mailing list and newsletter management, with lots of templates, plus it’s easy to drop html/css into (like from SiteGrinder...).
posted by dpcoffin at 2:24 PM on February 16, 2008

Jumping in on this, and the original request, which was to learn how to create enewsletters, not full websites, reveals an important issue few raised....

email software (outlook, etc) is NOT the cutting edge of browser compatibility and standards compliance - in fact, it's like stepping back in time 10 years.

Learning HTML/CSS is a great idea on paper (and I'm all for it) BUT for this specific task, could get you intro trouble.

The proper way to setup a CSS/HTML relationship is to put the CSS in an external file. BAD PLAN on HTML-formatted email - won't work. You have to embed inline the CSS. So one good practice, taught by all the tutorials, goes out the window.

There are other similar issues, and the long/short is that you really have to dumb-down your good standards and learning to a very basic level, or your mail will be mangled.

Mailchimp.com has a great email tool (inbox inspector) that helps you validate your html email template, showing you how it would look in a large variety of email clients. It's not free, but the good things in life rarely are...

Best of luck.
posted by MTCreations at 5:26 PM on April 30, 2008