One of the things that has kept me from doing freelance web work for a long time is graphics.  I've had no training in graphic design, and very little natural talent to speak of in the artistic area.  And let's face it.  In a public facing site, the look and feel is what gets a user's attention and keeps it, and thus determines a large part of a site's success.  Your app could function perfectly and provide incredibly useful functionality, but if it looks like the web circa 1996, it's going nowhere.  So I thought I was stuck.  I thought if I was ever going to be successful as a web developer, I would have to buy my graphics from a professional designer every time.

But a couple of weeks ago when the consulting company came in to demo some of their sites, I started to notice some patterns.  I'm not sure what clicked in my head, but I started to see what design details made the sites look modern and professional.  Now, don't get me wrong, I'm not suddenly some master designer, but I figure if I can deconstruct what makes other sites look good, then I can try to apply some of those principles to sites of my own and start to grow my skills.

The one thing I saw almost everywhere was gradients.  Seriously, take a look around your favorite site.  Chances are there will be gradients all over the place.  Everything from backgrounds to buttons to form borders use them.  And they make a huge difference.  For example, take a look at this button from the ASP.NET forums site:

Pretty basic, but still modern and attractive.  Before I started really thinking about it, I probably would have settled for something flat and boring like this on a site I made:

Okay, but not great.  But if we use a gradient instead of the flat blue color, and make the bottom right half of the border just a bit darker, we get this:

See how we get that "3D" effect?  It's a whole lot easier than I thought it would be.  The trend right now seems to be toward what I think of as "chunky" graphics, especially on modern, "Web 2.0"-ish sites.  Very simple shapes, but with a lot of depth and lighting to them.  For example, take a look at Mint.com.  The buttons, the leaf graphics, and the word balloons all use very simple techniques to give them a professional look.  This is great for novice designers like myself.  We can be trendy even while we're still learning the basics.

One thing that helps out immensely is having a good graphics editor.  As Jeff Atwood has said, every developer ought to learn to use one.  And not MSPaint, you wimp. :-P  I've been playing around with Paint.NET, and I like it a lot.  It has features that can produce some very nice looking grpahics, but it doesn't feel crowded or cluttered with unneccessary tools.  And, hey, the price is right!  ;-)  I've also heard some good things about The GIMP, if you're feeling Linuxy.

So if you have only thought of yourself as a programmer, unfit to wear that black turtleneck, just give it a try.  Download a graphics editor and try to duplicate a nice simple button or logo from a site you like.  It's easier than you think.