Slashdot Mirror
Future Skills for a Budding Web Designer?
ericdfields asks: "One of my lifetime career goals is to establish myself on some decent level or another as a well-rounded, (mostly) standards-based web designer with some backroom web development knowhow. The problem is I have no clue where to begin. HTML, CSS, JavaScript are an obvious start, but what about other web-driven languages? PHP, XML, SQL, Perl... the list goes on. Should I be looking to grab hold of some Flash and Director skills? What abilities will be needed on the horizon that I can get an early start on learning today?"
It's important to know how to use the french fry timer, so your fries don't burn. Also, you will eventually need to know how to operate the cash register. Fortunately, they usually have pictures of the items on the keypad, so it should be a quick study for nearly anyone.
Go back to say....1996 in your magical time machine
Join the HTML Writers Guild
Get a copy of HTML For Dummies
Move to California
Make sure that you have a good grasp of graphic design and layout/text editing. The best web-designers know more than just the techincal skills, they also know what a good looking page is supposed to look like. Most people are surprised that there are real and time-tested design standards. Violate them and no amount of techincal knowledge will make a webpage look good.
Flash is a great program, and has some incredibly appropriate uses, but more often than not people learn flash and then say they're web designers.
Please, learn the standards first, as you've given a tendency towards already. When it is time to learn flash, using it from a proper structural understanding of how the web actually works, including information structures, user interface experience and page interactivity will all help you construct better pages that take advantage of all the technologies at your disposal.
How about learning the "skill" of not using Javascript at all? If everyone had this skill, it would make make the Web a more pleasant place. Nest up, the elite "skill" of not polluting pages with Flashdross.
Don't blame Durga. I voted for Centauri.
would you want that as a career? The only career I can see shrinking as rapidly is the support centre phone operative.
Daniel
Carpe Diem
Good point. Basic design skills are lost even on designers of major pages. Visit Slashdot.org, Drudgereport.com, Google.com and copy what they do. Visit Foxnews.com, cnn.com,aintitcoolnews.com, newsmax.com and learn how not to do things.
Don't blame Durga. I voted for Centauri.
Everything *ML-related you can learn from the W3C's Technical Reports. They also have a wide selection of examples/quick reference material in their tutorials.
:)
I would advise not using JavaScript. Learn it all you want, but don't use it.
While we could have a PHP vs Perl flame war, I'd suggest you take your time and try them both. And for the heck of it, throw Python into the mix. Learn them all, learn their quirks, and decide for yourself which is better for the job.
Whenever you design a page, test it in lynx first. If it look good text-only, it will look good in anything (IE-related CSS hacks aside).
Ah, and pull random people from somewhere and have them test your sites. Don't help them navigate it; they'll let you know if it absolutely sucks or not.
"An infinite number of monkeys typing into GNU emacs would never make a good program."
I'm going to assume by "designer" you really mean a graphic designer, and not a web developer. That is, you'll be greating the UI and maybe putting together the pages, but not doing heavy development.
If that's true, I'd say the most important thing you can learn is what a dynamic site does. Understand that content will grow/shrink depending on the database at that moment and make sure your design can accomodate that.
I've been developing web sites for close to 10 years now and the ones that are the hardest are those where the designer thinks of a web page like a magazine page and doesn't understand that things stretch/shrink/flow.
That said, I'd also learn as much as you can about *how* the backend languages work (PHP, XML, etc.) but you don't need to know the specifics. But if you understand the relationships and their capabilities you'll be your developers best friend.
There are too many facets to learn it all. Pick the arena you are interested in, and work with others to develop the entire package. A "Jack of all trades" will usually create software that is mediocre in all areas.
10b||~10b -- aah, what a question!
HTML first, you need this no matter what. And learn it right, don't go putting FONT tags all over the place or build nested tables 6 levels deep.
CSS is next. This is what you use to make your HTML look pretty. Memorize all the little things, there aren't that many really.
PHP next. Play around with generating dynamic HTML.
Then MySQL (or other database), and practice creating forms that get saved to a database. I'd recommend spending a good amount of time on this one and learn things like database architecture and how to tune things.
Javacript should probably be last, since you shouldn't need it much, if at all. A lot of sites have a hundred K of javascript code to try and make things "cool". Go for functional, not cool. Things like confirmation dialogs are good. Things like form validate is WRONG - the backend should do that, not the client.
Photoshop is fairly important, but won't get you far unless you know the other stuff. Although you could do this right after HTML and CSS if you want to do some static websites for people. For dynamic stuff, functionality is usually more important than looking pretty is a business environment, but your results may vary. Besides, proper design will let your site look cool without a lot of eye candy.
As for Flash I don't personally like it and haven't bothered to learn it yet simply because I don't have a NEED for it. That's what it comes down to. Flash isn't necessary for web design. If a customer needs it, subcontract it out.
There are a lot of skills, as you've already realized, that go into web development. But to be successful commercially, you are going to need to learn to work as a team. Quite simply, if you are a good designer, you'll have too much work and will be a bottle neck.
The hard part of being a developer is troubleshooting, debugging and optimizing. The only way to know effectively do it is to have a complete understanding of the entire web process. Those skills really come only from experience.
It is learning how ALL the pieces of the equation fit together and interact. I.e How does the HTML in the site render with the browser, is the traffic effecting the performance, if so are the images to blame or possible a database connection? Is there a caching issue in the browser causing upodates not to show? What version of apache/PHP are running, how is each configured?
I own and run a small hosting company. I also do a lot of development using mainly PHP, but there are a few PERL scripts, shell scripts and even a C program here or there. My company specializes in hosting small developer and designers who are just getting started. So We actually get a lot of questions and issues, that usually stem from the fact that the people just do not have a complete picture of the system.
For example one of my larger more experienced customers who has two dedicated servers, and hosts about 300 domains on them, called me with a problem with a shopping cart she has used many many times before. For some reason the site was excruiatingly slow, and she did not know why. A quick glance at the config file told me she was running a database off a server in another datacenter. So there was a lot of overhead from the lookups. She knew this, but didn't realize the impact that geography makes, and she wasted a day trying to figure it out before calling me.
Anyway, in my opinion it is good to lear one or two skills really well, and assemble a team of people around you that can fill in the gaps. But it is equally important to know a little bit about as many skills as you can. This is important for several reasons:
1. If you are farming out the work you can give the subcontractor good specs, and can in general communicate your needs better.
2. If you do need to learn the skill it will be easier with some background to start.
3. A lot of the skills and languages and tools you learn share common elements, or at least common ideas. So by learning new things, you can often take those skills and apply them to your area(s) of expertise and become better.
4. learning about the features and benifits of a wide range of tools will help you identify the best tool for the particular project. That will help you be more efficient, and thus make more money.
Anyway if I were starting with a blank slate and wanted to be an independent developer. I would learn HTML and CSS as they are the fundemental building blocks. A server side language is also very handy, and will allow you to truely take advantage of the numerous free scripts. It is one thing to install a script, it is another thing to fully integrate it into a site, knowing the language will help. I prefer PHP.
If you pick up PHP, knowing basic SQL and specificall MySQL will go a long ways.
Flash, is handy but I try to avoid it for most sites, animated banners are pretty worthless none and really do not provided the customer with any bang for the buck. If your client insists on it, it is easier to farm out the Flash dev.
Graphics skills are very handy, but can be very tedious and time consuming. It is a good idea to know how to "tweak" images, change colors, crop, scale, etc using Gimp or Photoshoto, etc. But Like flash you may be better off letting an artist do the none technical design work.
Javascript has come a long way (or more accurately browsers have come a long way) since now it seems much easier to get Javascript to work across the various browsers. There is a plethora of quality free javascripts
HTML is a must. Learn it from the w3schools website - their tutorial rocks. Also check out XHTML, and see if you can conform to the standard in everything you write, whether it is required by your job or not. Standard conformity is a good way to save yourself when all the browsers in the world render differently.
CSS is good to know, BUT: most of the time, a company will have a CSS template that they use over all their web pages. Sometimes you'll just have to include this template in your HTML (a one tag thing), and sometimes you'll have to edit it a bit. If you ever have to make your own, a quick look at the above website will help you do it immediately (if you can already do HTML, CSS makes a lot of sense), although I wouldn't focus on it initially.
ASP (& VB), JSP (& Java), PHP (& Perl). Most companies are going to be tied to one of these three. The best thing to do is be a beginner at all of them - take a look at sample code from all six - and then become an expert on the job. My current employers (a university) are tied into Microsoft products, and politics (and other interesting financial things) keep them from changing. However much I would like them to move over to LAMP, I'm not going to sit and mope and lose my job. THUS, I code in ASP with Microsoft SQL-Server, and write VB programs for another section of my department. Be flexible. Don't assume you'll get to use your language of choice, wherever you work. Sometimes conditions prohibit it.
Learn SQL. Forget all this "learn MySQL" stuff. The connection to the database is generally something you'll write in 30 secs - with some template somewhere - and the SQL code to actually query and update that database is going to be the important, life-changing stuff. Learn SQL. On that note, if you're planning on being more of a back-end web developer (like me), learn database management. Learn how relational databases work. Learn how JOINs are your friend, and multiple relations (or tables) are a good thing. Ugly database code kills me.
And, to take a note from Joel yesterday, know how to communicate. Most web designers - the people who will be giving you changes that you absolutely must make or they'll die of horror at that color scheme - are art or design majors who have the elite thing going just like most of us programmers. Learn how to talk, how to listen, how to accept someone else's decisions when you don't have the power to make them - yet.
If you're planning on being back-end, there's a lot of other stuff you might need to know: how virtual directories work, how IIS sets up ASP applications, how Apache's configuration file works, how home directories are transferred over, how server scripting actually works, how to lock down a web server, etc. But if you have a good grasp on the above, and you stay flexible, you should be ok in the job market.
(That, and having all those acronyms on your resume will get people hooked if you can actually confirm your knowledge!)
I [may] disapprove of what you say, but I will defend to the death your right to say it.
First, I would say the market is full. Web Designers, unless they are very artistic, are low man on the totem pole. IMO, to say "when I grow up I want to be a web designer" for a teenager today is about like saying, "when I grow up, I wanna drive a UPS truck." That's why the other fellow's humor about flipping burgers is funny, sad, but true. You need to think more long term. Also, beware of the wave of out-sourcing
Go to college, and at least get a Business minor. Most of the technologies that are needed for web development are self-teachable, so (again, IMO), if you want to go into computers you may not needa a CompSci degree. Many organizations look for somebody who is technical, but who understands their industry--hence the business minor advice. By that, I mean, you'll understand a bit more about business. However, a business minor (or degree) is really generic.
I used to do IT, now I'm in law school. I don't necessarily plan to be a lawyer--I presently am inclined to return to IT. Having an advanced degree in an industry also helps your job potential.
When it comes to which languages to learn, HTML is too easy to learn to be mentioned--just follow the advice of others on this list and learn HTML properly, not like the WYSIWYG editors might teach. I'd recommend PHP, Perl, Python, all three. I'd also recommend a systems language (Java, C, C++), Mysql is prefect because it helps you learn the fundamentals of databases at a low cost (free).
Depending on where in the country your are, though, you may have to submit yourself to Mr. Bill. In my local market (I moved from where I did IT), Unix skills aren't as marketable as MS skills.
Anyway, a lot of service IT can be self-taught. So, educationally focusing on something else is good for balance. Business helps you communicate to the business types. Other degrees to other specialties. An advanced degree also helps as well as increasing salary potential.
Finally, Be Flexible.
What those who want activist courts fear is rule by the people.
One of my lifetime career goals is to establish myself on some decent level or another as a well-rounded, (mostly) standards-based web designer with some backroom web development knowhow.
4-5 yrs down the line you will probably want to be doing something else less web related - most people want basically the same thing from their websites. And once you have built umteen sites for umpteen different client - you will find your self wondering what other interesting development jobs there are about. I'd advise getting some other more generic skills - C/C++ maybe something else but that can easily be leveraged when you decide websites are'nt challenging any more...
Electronic Music Made Using Linux http://soundcloud.com/polyp
That depends in which direction you wish to go. Right know I find it good to have website built by few people. Usualy there should be one for website code/logic, second for database design and third for layout/visualisation/layout-specific-logic - for properly designed webpage (and such have future) it is extremely important to separate those things.
So as graphics designer you probably need to have good knowledge of:
1. Basics: HTML, CSS, graphics programs (loads of, depends on what is your artistic direction), maybe Flash (but I don't like it).
2. More advanced stuff: template engines like smarty or common CMS systems, W3C specifications, accesibity, interfaces design methodology, typography.
As database designer you should be aware of things like:
1. Basics: SQL basics, popular RDBMS like MySQL, SQL Server, PostgreSQL (go with this one), SQLite etc.
2. Advanced: database optimalization, RDBMS specific issues, DB abstraction layers (to make code portable between RDBMS), DB server administration etc.
As code/logic designer:
1. Basics: PHP, Perl, Python - you should at least know few such languages.
2. Advanced: internals of servers (like Apache), advanced programming (probably object oriented), use of popular extensions, systems (like Zope, Pear common CMS systems), templating engines (to work with graphics guy).
Also there is another side of Web which is *content* - it is also wide area how to manage your site, analyze visits, clickpaths, focus on best stuff and forget not visited parts, marketing and so on.
There is really lot to learn to be good webdesigner, you should know at least basics of those topics to be self contained designer. Otherwise I sugesst you focus on things you like the best (graphics/coding/managing etc.) and work in a team of narrow specialists.
You say web designer, so I will assume you want to go for a more visual development, than a programming/scripting side of it.
With that in mind I would suggest the following:
Now for the theory. This seperates the person who was good with crayons as a kid from someone who can seriously understand what a website means. You need to learn concepts beyond just simple design. You need to understand how web interfaces work and how users relate to them. Read the articles at use-it.com to get a initial understanding of this. You should understand concepts like the "page fold" and how does it relate to content on the page, how much time should a page take to load, most common page dimensions, what actions people commonly do under certain situations and what link colors people are used to and how should links look like. All of this mainly falls under Visual Information design. You have to know how to communicate what the information is trying to say. If you're the type who likes to go for the big flashy images, then you missed the whole point. If you start off your introduction with "I'm a print designer" or "I come from the print industry" then you need to stop, turn around and go back to the books.
Now for the tougher part. Adding in the developer side of things. If you want to become well rounded, the main questions to ask are:
This is not to discourage but to at least ask the basic questions
If you want to at least have an understanding, then I would suggest...
If you want to do development, then I would suggest...
...if you want to be a designer or a developer.
By the definitions that are used in the circles I am involved in a web designer is someone that mostly is designing the visual, purely front end, aspects of the web site. The web developer on the other hand involves the addition of software development that happened to involve using the web browser/web server client/server paradigm with dynamic content.
Between the two, you will be much more marketable as a potential employee / contractor if you are the developer.
Like any other software developer, you need to be familiar with general computer science topics. Also learning to think algorithmically and having a solid handle on the theories of procedural and object oriented programming and then expand into the languages that are relevant to your specialization - In this case web programming.
Another important prerequisite is an understanding of software life-cycles. Web based applications (yes, a web site is a web application) are no different than their desktop cousins in that they grow, adapt and ultimately reach a point that they need to be updated and replaced with newer iterations of code.
With respect to specific technologies, if you have solid grasp of procedural and object oriented programming, moving between PHP, Perl, Java etc. shouldn't be that huge of a leap. A prime example of this is that PHP and Perl share a great deal of like syntax.
My personal opinion on the "essential" technologies of web development with respect to languages are as follows:
PHP and Perl - If you want dynamic content you need a web language. Java servlets have a little higher of a learning curve, so I would start here.
SQL - If you have dynamic content you need to store it somewhere and flatfiles are poor for performance and developer sanity. Learn SQL (mySQL is a good and cost effective place to start)
CGI - Although CGI is a communications environment to get data to your script when executed server side, and not a language per say, you need to know how it works in your sleep. The moment you have one dynamic thing on a web site you are touching on CGI in some way and just relying on your language of choice to decode passed information to you is not going to cut it in the real world.
Apache - One other thing to mention is that you should also become very well acquainted with the behaviors of your web server. I would recommend Apache for two reasons. One is that it is readily available in an unencumbered form. Second, although there are many fanboys that may pipe up and recommend there favorite although less popular web server. Apache quite simply is dominant because it covers all the bases, performs well and quite frankly makes it so there isn't a major reason to bother with anything else. Apache has a multitude of modules available that extend and enrich the functionality of the base server platform. Knowing how to make use of them is something that you don't want to pass up.
As far as non-essentials to pick up on once you have the above out of the way:
Java - In many places where you are developing a large scale web application, a well placed java applet can be helpful. This can include real-time communications interfaces for chat functionality, or multimedia services.
Flash - I'll be the first to advocate NOT using flash wherever possible, except in some extreme cases. However there is a point to be made that knowing language is a good thing, not for just writing new things, but also for reverse engineering or porting an application to another language.
My $0.02
One of my lifetime career goals is to establish myself on some decent level or another as a well-rounded, (mostly) standards-based web designer with some backroom web development knowhow.
Lifetime goal? Either you're twelve years old, or you're setting your sights really, really, really low. Or both.
Web design used to be tough a long, long time ago. These days, saying that you're going to be a well-rounded web designer is like saying you're going to be a well-rounded word processor user or desktop publisher. Off-the-shelf tools like Dreamweaver can produce web code more than good enough to get by. The challenge is no longer the tool, but the content: businesses have a greater need to put together sensible content that users want to consume, rather than just putting together a well-formatted web site.
If you want to build a set of lifetime career goals, get a role model and ask them what skills they use in their daily job. Don't make the mistake of asking them how they got their start, because lots of us got started in web design because it was tough ten years ago. It's not tough anymore, and it's not a great place to start now.
If you want to make money on the web, don't get started with design - get started with content. Find a subject that you're an expert on, and build out your content using any run-of-the-mill web site management system like Plone or Xoops. Forget getting good at HTML - any monkey can do that. Get good at providing content that users want to return to, and then you have a shot at making money.
What's your damage, Heather?
...is the single most important skill you'll need.
Don't specialize on technologies, focus on problems instead. You'll have to learn a new technology every year to solve the ever same problems.
to establish myself on some decent level or another as a well-rounded, (mostly) standards-based web designer with some backroom web development knowhow. The problem is I have no clue where to begin. HTML, CSS, JavaScript are an obvious start
This is just an opinion, but it would seem to me that if you don't already know a big chunk of html, css, and some kind of scripting language, you're not really in a position to decide that web designer/developer is the right career. Get some experience. Find out if you like it. Then start planning how to enter a career.
As for web technologies, especially on the developer side, be prepared to enter a never ending learning cycle. There are tons of different standards and technologies out there that all have to do with presentation on the web. Many of them are in flux.
As for what a person should learn first... the plethora of technologies makes that an open question depending on what kind of projects you are working on. On the bright side, learning any kind of web programming will move you closer to your goals. Some tips:
* Target rising technologies like PHP.
* Avoid obsolete stuff like ASP.
* Avoid anything that is "company XYZ's blah". For example, Macromedia ColdFusion.
* If you are not a developer, avoid complicated platforms like J2EE or ASP.NET. Simpler scripted languages like PHP or (shudder) ASP will be easier to get going productively.
Also, I don't know what kind of background you are coming from, but you should realize that good web design requires a strong design background. It has little to do with languages. Being from the other (developer) side of the pond, I've found books like Steve Krug's Don't Make me Think and Robin William's Non-Designer's Design Book to be quite valuable and easy to read.
Just make pretty pictures, chop them up, and slap them into Adobe GoLive, poof, you're an instant web design professional! Now open wide and wait for your money to roll in.
Seriously though, at one time I wanted to do web design as a part-time side job, but after creating a couple sites I decided it was a terrible idea. So, unless you enjoy making websites for people that have no freaking clue what they want on their site and aren't willing to provide you with any text related to their website topic, then don't do it.
Less "web designers" == Less worthless websites
Learn to speak Hindi. BC
The fact people view the programming as trivial is why there are so many crappy, bloated web pages out there. The graphics arts is the part that is trivial... you can make a great informative, usefull, and traffic'd site without any graphics at all. Just look at /. These sites that are all done w/ graphics and flash might be fun to look at but are for the most part very annoying to use... especially for those w/ lower bandwidth.
I would start w/ Jakob Nielsen's book Designing Web Interfaces. That will give you a basic foundation of thinking about a good user interface. Then you might want to read Zeldmans Designing with Web Standards and Cederholms Web Standard Solutions. That will give you a PROPER understanding of standards based html markup and a good intro to CSS. (Read Eric Meyer's books to further your CSS).
As to the programming for web driven apps - I like PHP the best - XML and SQL you would use within PHP. You want to have a good understanding of both of those... SQL especially to hook into database type stuff. Javascript, I'd just get a Cookbook or something - most of what you want to do with that you can quickly pick up from sample scripts.
Remember - HTML Editors are the devil!
"except that i would suggest he learn XHTML 1.1 rather than HTML"
:/
Aside from pointless spec (or IE) breaking, what does this achieve over XHTML 1.0 or HTML 4.01? Markup wise, HTML 4.01 Strict is pretty much identical to XHTML 1.0 Strict and XHTML 1.1, but there are a whole load of other issues with using XHTML (1.1 especially) you need to be aware of that suggesting everyone use it is just.. well, silly. This is not a place you want to version-chase unless you like unnecessary hacks and more points of failure.
"a compliant, doctype'd page renders faster than HTML 4.0 in Mozilla and IE"
Wrong. IE supports XHTML the same way it supports tag-soup HTML, and so does Mozilla unless you serve it with a Content-Type IE doesn't support. Unless you have a real reason to use XHTML, it's generally better to use HTML 4.01, especially if you're playing with JS and DOM. Seriously, you're recommending to a newbie to use a doctype who's entire DOM model changes depending on how correctly you serve it?
In my capacity as a web developer, here are the software packages that I feel you should have a firm understanding of:
And now for some soft skills. First, you'll need to learn to give effective presentations. You could use Powerpoint for this, or Keynote or Impress or just print them on transparencies and put them on an overhead projector. How you do it is up to you. Will you ever need to give presentations? Not really, but effective presentations require a lot of soft skills - eye contact, graphic design, pacing, speech tones, body language - that to be skilled in presentations in general means to be skilled in a lot of other areas.
You should also familiarize yourself with colour. Learn about Pantone, just so that you know about it. Learn how colours play off each other, which colors look good on which backgrounds. Learn about bordering, whitespace, balance, and form. Consider the Pantone Guide to Communicating with Color - out of 61 reader reviews, it got 4.5/5 stars, and is a good place to start.
Learn about logos. How companies make logos, and why. What goes into making a logo, subconscious suggestions from logos (there's a reason Playboy picked a bunny for their logo, and it's not obvious). This will help in your graphic design and page layout.
Learn about accessibility and colour-blindness.
I'm probably missing a ton of important stuff, but if you do it right and are willing to learn (and posting on slashdot seems to imply that), you'll probably learn what you need to know as you go. If not, just come back and post another Ask Slashdot.
java script and active x websites force people to surf randomly with that stuff turned on. Why do you want to do that? There's more than enough evidence to show that basically it's a bad idea. Your particular site might be totally innocent, but you have no guarantees about other sites, so you force users to set preferences back and forth constantly. This is the 21st century, people use tabs and multiple pages open, not just one...page....at .....a ...time, and jump back and forth. JS and Active X is a *threat* in general if you do that.
I avoid sites that use javascript now, especially because rarely do they provide an alternative way to navigate inside the site, and they usually don't use alt tags on image links either. JS *works* and does all kinds of nifty cool keen stuff, but it's bad for security, you can't make it work to be good for security,so, why do it? Convenience? For whom? The visitors? No it's not it's a threat and useability flaw. And as such my personal opinion is it shouldn't be used for web pages. On your closed intranet, sure, go for it, no probs. I am just not going to keep jumping back and forth in preferences to turn it on and off. To me, telling your webpage visitor that they have to use JS just to see and use your site is absolutely no different from coding it to only "work" under one web browser. It's just too easily abused and it's insulting actually. I haven't kept track but I can asure you there's more than a few web merchants who haven't gotten my cash business because they insist on JS, and I am able to find an alternative that doesn't, so they get my money instead. Just how it goes. And Flash without an option, just click on a link then it's a 50/50 crapshoot if it will lock up your browser or not. Well, to be fair that is only one guys experience, mine.. Again, no thanks. Give me an option to click on the flash, just don't spring it on me on the homepage of some site.
webdesign is still design, so study to master the basics elements of design:
a) composition : creating balanced, interesting , beautiful layouts. study the grid system in depth and be aware of the latest trends (vector arrows and three million lines packed into a small screen). 'less is more': study minimalist.
b) typography: most content on the web is text . learning how to make text look good (readable) is essential. get to know typefaces, their uses, combinations.
c) form: you dont have to draw, but the better you do, the less resctricted you will be on you designs.
d) color: color is paramount. there are tons of good materials on color. the best source is probably painting, painters know all about color. if you are willing to get your hands dirty, painting will give a great start into colors.
also, you will probably be working a lot with photography: dive into it. take a lot of pictures. learn darkroom techiques. the better photographer you are, at least you will be able to choose your photo material/ work more closely with photographers.
the best way to achieve all this is probably to study graphic design in general. there will be tweaks and differences from the web, but these are much easier to pick up once you have got a solid foundation. also , most webdesign study material is very poor on designs basic elements, so they are not a good source.
the things you can mostly ignore from graphic design is technical information regarding output and 'art closing' like pantone color matching, duotone printers, offset setting and stuff like that.
thats the static part, then study interactivity: acessibility, navigation, ui and you if you are feelling artistic all of john maedas work.
enjoy
First, you've set your lifetime goals way too low. If you are any good at all, you will have achieved this in less than a decade (probably half that) and then it's crisis time. Set your lifetime goals higher, the higher the better.
Second, while you do need to know this technical stuff, that's not all there is to it. On top of HTML, XML, CSS, JavaScript, Java, PHP/ASP and SQL, you will need to understand (and be good at) graphic design, and have some other domain knowledge that gives you insight into the business reasons for the web design work you do. You can't get most of this knowledge quickly or easily, some of it you simply must be born with and some of it will only come after decades of experience.
Your best bet is to go straight to your local community college and enroll in the Web Design or Web Programming certificate course. While you're at it, think about enrolling in some other, largely unrelated major (business management, visual arts, chemistry, psychology, english literature, whatever) which will give you some outside perspective to ground your technical skills. You can finish up both the certificate and the AA in two or three years as a full-time student, or four years of part-time school/part-time work. While you're there, take advantage of an internship or cooperative education program.
If you're feeling really energetic, replace community college and AA in the above paragraph with university and BA or BSc. Lather, rinse, repeat.
Learn how to evaluate a complicated mathematical expression. There are examples you can use everywhere but if you don't know how to read the math symbols you won't know how to apply them.
Know how logic works. Conditional statements are what makes a web application do almost everything it does. If this condition, do (a), if some other condition do (b), else do (c). You can copy and paste code to get some functionality to happen but if you don't know how it's logic operates you won't be able to customize it to your particular needs.
Compose things, don't just throw them together. Composition includes balance, hierarchy of importance, and purpose. Use composition when creating the look of a site and when designing the architecture and user flow.... composition tells your audience how to use your site and what is important and what is they should pay attention to.
Marketing and Business skills will help you understand your clients needs as well as aid you in your own personal success whether you work with a company or on your own.
Everything else you learn now will most likely be old-fashioned or worse yet EOLed by the time you get into your career... even if you plan to start working in 2 years... languages come and go, applications change all the time and new ways of doing things are constantly being invented or 'innovated'.
A fool throws a stone into a well and a thousand sages can not remove it.