Web Designer's Arsenal

[Paralys]

Well... I'm getting into web design, have been wanting to go into it after I get out of school. this is what I got so far:

Software:

MS Office 2003 (Frontpage and Publisher is in mine, I say this because I'm not sure if they're in all of them, frontpage isn't in the one at my school.)

Dreamweaver 8

Flash Professional 8

Fireworks 8

Photoshop CS2

What I know:

Everything about HTML

I came here pretty much looking to be pointed in the right direction by someone who has knowledge in the field. What language should I learn next, I've had a lot of suggestions XML, Java, tons of different ones, what's everyones opinion on that? and is there anything else I need to add to my software?

Any tips from what language to learn next to software to just general tips is VERY appreciated. Hope everyone will help me out on this one :D

Thanks,

Paralys

[nullspace]

The only tools you should really need:

Windows:

notepad, I like notepad++

firefox w/ web dev plugin

gimp

Unix:

vim (edit config file so syntax is pressent)

firefox w/ web dev plugin

gimp

in my opinion flash sucks (except for video).

If you plan to stick with web design and you already know HTML (I'm sure you don't know everything). Well then I would say follow this path XHTML, CSS, PHP or PERL (my fav) or Python, Javascript. I organized these in a sequence or increasing complexity and what to me seems like a natural progression of adding functionailty to your sites.

[Paralys]

The only tools you should really need:

Windows:

notepad, I like notepad++

firefox w/ web dev plugin

gimp

Unix:

vim (edit config file so syntax is pressent)

firefox w/ web dev plugin

gimp

in my opinion flash sucks (except for video).

If you plan to stick with web design and you already know HTML (I'm sure you don't know everything). Well then I would say follow this path XHTML, CSS, PHP or PERL (my fav) or Python, Javascript. I organized these in a sequence or increasing complexity and what to me seems like a natural progression of adding functionailty to your sites.

lol I agree, maybe not everything, but as much as I could possibly learn, thanks for your opinion on the order of languages too, ill look into that. Hope everyone will continue to help me out on this, as well as hopefully posting a few links that will describe some of the languages in a clearer way and even more opinions on software/language order.

[nullspace]

http://www.w3schools.com/

great simple little starting place. I would suggest wikipedia and your local library for reading up on this stuff.

[Ecky]

Next on your list should be PHP and a database (I use MySQL).

As for myself...its quite a long list:

HTML

CSS

PHP

Javascript (incl AJAX)

Actionscript (Flash)

SQL

XML

ASP (not using it anymore...I prefer PHP)

As for proggies:

Dweaver 8

Flash 8

PS CS (my works copy)

Adobe GoLive (my works copy)

Good 'ol Notepad

I have been going into web dev for about 6 years now and theres quite a lot there to prove it. My first job I ever got, which is my current one at 16 years old, is working as a Website and Database Developer at a design firm. Not flipping burgers or stacking shelves :P

So theres the light at the end of the tunnel...you now need to walk to it :)

W3Schools is my bible along with Google. Also http://php.net has a detailed list of all its functions.

[mleo2003]

Having went to college to be a Web Development major, I can honestly say listen to nullspace, and you'll be fine. Everything he recommended, I was required to learn, and with the books being outdated so easily, we should have just used online materials to learn from any way. I also like his order for learning the topics.

As for links, his w3schools is the top one to visit, but here are some others that helped me starting out:

www.htmldog.com - Very nice HTML & CSS references, as well as different levels of tutorials on those subjects

www.htmlgoodies.com - A huge repository of tutorials on almost everything web-dev.

I have more specific ones for other purposes (PHP, Perl, etc...) but those helped me out at first.

[ichthuz]

as you are looking for mainly design i would concentrate heavily on CSS and its various hacks and tricks. i can tell you there is nothing more frusterating than having your divs work in ie6 firefox and opera but not in safari and conqueror.

/* its a handling exeption having to do with comments btw */

ill dig up some links and edit this later

[kickarse]

To be a good web designer, I concur. You MUST know the coding in order to design accordingly. There's nothing more exhausting than explaining to a person with a Publishing background why they can't put that text over there or make it THAT big/color/etc.

[psychoaliendog]

It seems all the important stuff has been mentioned, but some other stuff includes:

• Programmers Notepad (great little notepad replacement)
• Inkscape (vector art, You can use SVG dircectly in Firefox :) )
• linux/unix (you need to learn linux/unix, most servers run these platforms)
• Internet Explorer v5, v5.5, v6, and 7, Opera, Firefox; (for testing on as many platforms as possible)
• Stock Photography (If you see something cool, take a picture of, you'll need it later, trust me)
• Basic Art concepts(line, space, shape, color, value)
• Practice

The web is constantly changing, so, keep up on stuff. And for Pete's sake, don't use a particular tool just because someone suggested it, try them all, see which ones you like. I know too many Designers/Developers that use Dreamweaver/ASP/IE unconditionally.

[cooper]

Start with learning HTML and CSS and all that using a simple text editor that you're comfortable with, preferably one with syntax highlighting. When you're familiar with just what goes where and why, you can consider moving on to using tools that do some of the heavy lifting for you. Then you can view the HTML they produce and decide wether you'll accept their HTML as is, if it needs some (serious) cleanup, or if the tool fucks up the HTML so badly that you can't imagine putting a site up with your name attached to it, carrying HTML that looks like _that_.

This is how it works with most languages (regardless if it's markup, programming or other). Learn the _language_, then learn the tool (but language always trumps tool).

This allows you to understand what the tool does for you, how it (probably) does it, and possibly why doing it that way forces you to make certain concessions in some areas, but that will reap you great benefits elsewhere. But must importantly, if the tool changes, or your tool of choice isn't available, you'll still be able to be productive.

[Paralys]

Thanks for all the help everyone, though I was just looking at XHTML and I've noticed some differences, but correct me if I'm wrong here, but the message mostly sounds like "Don't write crappy/messy HTML" and not much else seems to be different..

Once again, thanks for the help and if anyone has any other suggestions, feel free to post em.

[william232]

Yea you may want to get a degree or diploma for web development.

[AnonYx071]

Thanks for all the help everyone, though I was just looking at XHTML and I've noticed some differences, but correct me if I'm wrong here, but the message mostly sounds like "Don't write crappy/messy HTML" and not much else seems to be different..

Once again, thanks for the help and if anyone has any other suggestions, feel free to post em.

Well, that's because writing good markup is, obviously, very important. It's supposed to be clean, work effectively on every browser, and be accesible. It also tries to achieve what HTML is supposed to be used for, and that is to display information. XHTML does that by removing style tags and attributes and leaving the styling up to CSS, which is how it's supposed to be. You should check out http://www.csszengarden.com/ to see how to seperate HTML and CSS efectively. You should look at the original html file to understand what I mean better

http://www.csszengarden.com/zengarden-sample.html

[a5an0]

You already have HTML, which is nice. Next you should tackle CSS, so you can get some formatting/stlye/layout. Then php or python sor server-side scripting and javascript for client-side scripting. Coop is right though, don't get caught up in all the fancy IDE's and shit. knowing php and using notepad is better than having zend studio and thinking that <? is a question.

[Paralys]

Hey again guys, I don't mean to revive my dead topic or to make a meaningless post that sounds like I'm bragging. But I'm pretty surprised. I actually got a job lol or at least a temporary one. I'm doing a page for a guy in teleseminar marketing and he needs a single page using simple HTML done, I'm getting 200 bucks for doing the page so, with my first job (other than that internship I had) I'm pretty happy to see I'm actually going somewhere, I'll probably post a link to the site after its done. :D

[lunex]

a single page using simple HTML done, I'm getting 200 bucks for doing the page

Wow. 200... Is that USD$? For one page? Sounds like he didn't shop around very much or you're a good con. Congratulations! However, for that to be economical you must be able to create a unique style and enter the content in just a few days and start your next job really quick. $200 doesn't last very long.

[Paralys]

a single page using simple HTML done, I'm getting 200 bucks for doing the page

Wow. 200... Is that USD$? For one page? Sounds like he didn't shop around very much or you're a good con. Congratulations! However, for that to be economical you must be able to create a unique style and enter the content in just a few days and start your next job really quick. $200 doesn't last very long.

Yeah 200 US Dollars... lol not worried about it lasting long, I'm a Senior in Highschool not worried about bills. :D

[tazmon95]

Well just recently found HAK5 on iTunes and love it. Anyways I saw this post and there were a couple tools I wanted to recommend. While a lot of the tools listed are good, I've found a certain setup to be by far the best and most economical.

Graphics: Photoshop CS2 / Fireworks 8 They are both good and approach the same thing from different angles. Think of Photoshop as dealing mainly with adjusting pixels and Fireworks as more vector based. As far as which to use, I would say that Fireworks is easier, but Photoshop is more powerful.

Coding: HTML-KIT or Eclipse. I've paid for others, I've tried notepad++ etc. but I have to say that those two are the best. They both are quite modular letting you download the packages you want to use. Eclipse is geared more toward Java programing, but it's pretty easy to set it up for web development / php development. HTML-KIT is a bit smaller on the hard drive and focuses just on web code. I use them both depending upon the project, Eclipse is a must for PHP.

WYSIWYG: Don't. Learn how to do the code. If you want to be a Pro, you NEED to be able to look at the code and see how it should look in your mind and almost be able to validate it in your mind. Dreamweaver, Frontpage, etc, stop that from happening while writing crappy code. (Dreamweaver is better than Frontpage if you need to use one)

Where to focus your skills: Learn XHTML and CSS. As others have said this is where any pro should go for web design. Once you can code a great static site using XHTML and CSS, then it's time to start looking at dynamic sites. I would go with PHP myself, It's powerful, connects VERY well with a MySQL database and best of all... IT'S FREE!!! Just don't try to jump into the PHP until you know the XHTML.

Resources: I have to say that for me the best / most helpful resource I've found anywhere to learn web design is http://www.communitymx.com/ They have articles and tutorials covering everything any noob / pro could need.

Testing: Use Firefox with IETab installed. If you have a multi-monitor setup, use one for coding and one for preview / file management if you just use one monitor, get a virtual desktop program. Personally I run four 20" monitors at 1600x1200 for my design studio. One for coding, one for graphics / flash, one for preview, and one for file management / misc.

Tips: Validate every page as you go. I suggest getting one of the Validator extensions for FireFox that will tell you for every page you visit if it's valid code or not. Also only use up to CSS2 don't go to CSS3 yet.

As far as learning Java... It's not necessary for a good site. In fact I would say that in about 90% of the time that Java is used it's not needed. Most of the things that people use Java for can be done with CSS/XHTML

Anyways, that's my introduction here and my recommendations. I hope that this will be useful to some of you and Paralys, good luck with that job.

~Taz