Okay, heres my problem. A few years back, I got into making websites and such. This lead to me getting into programming. At the time, I wanted to make a text-based game, so I learned stuff like PHP and MySQL mainly. I've gotten good at that, and branched out to stuff like C++.
Now, I want to make some money. I'm 14 and so the most appealing way for me to do this seems to be web design. The problem is, while I learned a few programming languages, my sites look like shit. I know CSS and HTML and I'm fairly creative, but when I try to do it, it ends up looking like blocky crap.
I guess what I'm looking for is some sort of tutorials to point me in the direction of, uh, well something thats not trying to teach me CSS or HTML so much, but how to apply it.
I should also probably note I'm not very good with images, which kind of hinders me. I learned how to make banners in GIMP with filters and fancy text tricks, but other than that I don't know much.
Thanks in advance!
Posts
Accept that everything will be different by the time you reach college.
I...hum...despite studying design for 5 or 6 years, I'm not sure where you'd go to actually find design tutorials. I guess a start would be to actually actively study other peoples designs (not mine, you'll only learn bad things from me) and actually de construct the design rather than the code. As in, look at what colour combinations they've used, what fonts they've used for headers and body text, how everything is arranged and positioned and so on. Don't just make a list of every feature they've used, actually try to figure out why they've used a particular colour there or positioned the navigation bar there. Try to understand the reasons for the designers decisions both in terms of aesthetics and practicality (does it improve the navigation to have the links in a certain order, is the text more legible because of the font and colour combinations used etc.).
I don't know of any online tutorials, but there are a few books which are critical reads for designers. Things like 'The Elements of Typographic Style' by Robert Bringhurst and 'The New Typography' by Jan Tischold spring to mind, but you'll really learn the most by immersing yourself in good design and trying to figure out for yourself why it is good.
I'd also suggest reading anything you can on web accessibility. Read the W3C standards guidelines if you can comprehend them otherwise seek out books/websites on accessibility, usability and interface design.
But if you just want to make a little money, look for a designer who just needs someone to code web sites. Most designers don't have time to sit around figuring out the W3C's painfully obtuse “standards,†nor do they have time to try and figure out why the code renders incorrectly in both IE and a-certain-so-called-standards-compliant browser so they end up passing the layout on to someone else who hacks the code together. It's actually a pretty good way to make money, once you know XHTML/CSS you can often find these sorts of jobs on Craigslist and similar sites.
Uhm, that's pretty much it right there.
A majority of "professional" looking websites have two critical components:
1) Gradient color transitions in the form of tiling images, often found in the background and in small cell headers, also drop shadows.
2) Some form of photographic/creative header or tagline image to anchor the page.
CSS wasn't intended to make your website look cool all by itself. Until browsers support run-time graphical elements like drop shadows and gradients, you will always need photoshop skills to balance your site. These things sound dumb and simple but they are the subtle elements that make websites pop off the screen.
Take for example, a minimalist website like this one http://tv404.com/. If it weren't for the small drop shadow, rounded edges, and header image. It would be a white box with words in it. However, cheap graphical touches round it off and make it look more appealing.
Those are the types of things that can help your own designs.
No matter what, just making colored divs with CSS isn't going to get you very far, but if you can pull off that simple stuff then your site functionality will help sell a cheap design.
Trust me, when I did my first portfolio review I had four websites in my portfolio, three were graphical (one was super fancy graphical) and one was just a white box with an image and a whole bunch of PHP behind it, and the one that got the most interest was the white box. That's the advantage you have coming from a programming background as opposed to a graphic designer background.
we also talk about other random shit and clown upon each other
It might not be a bad idea to take a look at that as a jumping off point for analysing sites on your own. But like supabeast says, if you really want to become adept at graphic design you can't do much better than college. You really want a grounding in traditional art and design, to understand the fundamentals of typography, layout and colour before you can start making the leap to good quality contemporary design. But in the meantime, I still think you can certainly learn a lot just from critical analyses of other peoples designs (which is basically what you spend most of your time doing at college and throughout a career in graphics anyway). As Jasconis demonstrated, being able to identify the minor graphical elements that make a design stand out can enable you to transfer those ideas to your own design language.
I'd argue that if he's only 14 and he's already got to grips with the coding then he's got plenty of time to learn the design side of things as well. There are a lot of high quality designer/coders in web design who are equally proficient in both disciplines. But yeah, in the short term if he wants to earn some cash then it might work out better if he can find a friend who's good at design.
A. Start doodling
B. Look up tutorials on "composition"
C. Read art books, most especially about "composition"
D. Repeat B and C except this time with color.
Once you have those foundations down you can start looking up stuff to do in Photoshop and Illustrator or whatever you wind up using. However until you can sketch your site on paper, I doubt you'll be able to easily make it a reality.
If you do get a partner, and want to learn that side, then you really need to watch your partner work every now and then. Get a feel for the decisions they face and make on a daily basis.
You're absolutely right about the images as well, and that would probably be the best area for me to delve into right now. The problem I've always had with images is that I'm rather apathetic towards the whole process. Though, when it comes to making little curved bars and rounded edges, I shouldn't need a whole lot of interest to do that.
Also, thanks Szech. I'll probably look into picking up some of those books. I think analyzing sites is something I have always done, but never to any great extent.
If he's 14 and gets on the design bandwagon now along with continuing to develop his programming, he has the potential to be pulling down the cash with both hands and some kind of mechanised cash-grabbing machine by the time he's 20.
Unofficial PA IRC chat: #paforums at irc.slashnet.org
That's what I was thinking.
Also:
Take a graphic design course if you have one in your high school. If it's a good course, taught by somebody who knows what they're doing, you could learn some valuable lessons about placement, white space, fonts, etc...all things that can help you in webdesign.
That's an excellent point. Still, in terms of making money in the here and now, focus on the coding. The design you can teach yourself on the side with a couple books and doing a hell of a lot of surfing.
If you wanted to get a job as a web designer/web developer, what programs/languages would you consider learning? Which are the ones that are demanded the most by employers?
As for the design side of things, I can't really help.