Learning Website Design

So I have a rather diverse skill set (product design, systems engineering, graphic design, etc.), but the one thing I’d love to know how to do is: how to design websites.

Yet there are so many different ways to build a website! If I had to learn ONE method (CSS, Dreamweaver, etc.) over the next 3 months, what should it be? And what’s the best way to learn it?


Check out Codeacadamy.com

Start with HTML and CSS then move on to javascript if you’re feeling like becoming a code monkey.

When you say one method - it’s kind of a misnomer - Dreamweaver is a WYSIWYG editor tool for both HTML and CSS. You can write code by hand, or try to build it in a WYSIWYG mode which personally I would not recommend. It will get you a result, but you’ll quickly find out it does some very sloppy things, especially for a novice. The end result will be a website that may not display correctly across browsers or platforms - and the last thing you want is your website to blow up if you’re using it for something like a portfolio.

HTML & CSS when used properly are very powerful, and the basic elements can actually be understood fairly quickly. The http://www.w3schools.com/ website is a great reference and once you understand the basic tags of HTML, you can quickly learn CSS for how to begin to style and sculpt your web page. Years ago, tons of work had to go into the HTML because CSS was poorly understood and poorly supported, especially in Internet Explorer, so people would use HTML to “style” the webpage, rather than just wireframing the content to be styled by the CSS.

Dreamweaver is a useful tool for making sure your code is written correctly and cleanly formatted (I still use Dreamweaver for writing code) but I would avoid the WYSIWYG part at all costs IMO.

Javascript is much less useful these days, and 95% of the useful Javascript has already been written and you can just drag and drop the code where you need. A lot of what javascript used to be useful for (rollover behaviors and all that jazz) can now be accomplished via CSS or HTML 5.