I'm a programmer (hobbyist, but looking to make it a career) by nature so when I was asked to design a website I felt a little out of place (most of my applications don't have pretty UI's, they just work because I'm the only one using them). I have been looking into how I could design my website and started wondering how you guys decide.
What guidelines can you guys give me? What should I consider before I start coding?
It's pretty hard to sum up the whole field of UI design in an answer.
Make the most common tasks the easiest. Figure out what people will want to do, and make that as intuitive and straightforward as possible. Don't make them think.
Make mockups and prototypes. Watch people try to use them (watch, don't help them), and fix things that they found awkward. Your first attempt at a design isn't right, don't be too opposed to throwing it away.
There's really so much to this field that it can't be explained to anyone easily. Designing is no less complex than programming, but many programmers seem to look at it as an afterthought for some reason. Try some creative googling for design principles, especially as they apply to the web. Look at sites you consider well-designed and try to figure out why they feel that way to you.
Design and building HTML/CSS from a design are two different games. The first requires artistic skill, the second requires a large knowledge of how HTML and CSS should work and how some browsers choose to understand those rules.
For the first, if you can design, great. If you can't and the client wants something you can't deliver, talk to freelancers. There are a billion of them out there.
Building it out can be comprehensively learnt but it can take time. If this is the first time you've taken a complex design to web, you might want to outsource that too... But it's really something you need to be able to do if you want to make a career of this.
There's no reason you can't do everything but you need to appreciate that your skills will improve over time and when you do your first, it could be a lot better. As with everything, practise makes perfect.
Since you were asked, I assume there is a customer involved in the process. So create a prototype, try and get feedback and keep going according to that feedback, try to always keep tack on those feedbacks at final stage it might became very helpful. In most the cases creating design depends on the contents of web site. Before you make your sketch go through sites with the same topics and same context in order to get some ideas in your head. After several times you will gain some skills and the ability to actually feel how it is suppose to look. My personal advise is try to think of clear design, avoid cluttering, think about usability and about functionality in most cases enough common features.
I've realized I'm bad at web design: I know HTML, CSS (both pretty well), but I don't know how to make a page look good. So I use existing templates, and make small adjustments or customizations. See these questions for free templates:
http://stackoverflow.com/questions/851666/free-website-templates-royalty-free-css-html-asp-net
Read, read read!!!
The best thing to do is read up on design techniques, and coding practices!
Design sites: http://www.smashingmagazine.com/ http://www.youthedesigner.com/ http://www.psdtuts.com/
Coding sites (design minded): http://www.nettuts.com http://cssglobe.com/
All the above answers are great! My advice is to learn as much as you can by studying others (and asking questions).
I agree with the approach that just researching and reading and looking is the best path to becoming a good designer. I think sometimes programmers are afraid of the 'artistic' realm because it's so subjective, or they think that they need to have some natural talent.
Most good artists work really hard to refine their craft. Natural talent is roughly as useful to a designer as advanced math skills are to a programmer. It can help in some areas, but just isn't required.
Look at popular sites that have similar objectives. How are they solving their problems using visual elements? How is information arranged on the page, how can it be broken down, what pieces are vital to functionality of the site, and which pieces just help improve aesthetic presentation (or don't improve it)?
While it's never cool to just rip off a site design, it's perfectly normal to borrow techniques or ideas and use them to create your own original design.
Make a wireframe first - this will allow you to effectively place the information on the page and think about architecture and functionality without worrying about the 'pretty' stuff. Then move onto an image mock-up that is a fleshed out version of the site. Don't be afraid to throw out designs and start over completely.
There are a number of graphic design principles you might pick up along the way. It's always good to keep them in mind, but my advice is just to go with your gut instinct for now. If you know any skilled designers, ask for feedback. Designers love to critique (in a nice way).
A lot people will suggest to just keep it simple and straightforward. That's great advice, but just remember: simple can be really hard.
As for an online resource, I think Web Design From Scratch provides a lot of good advice in one place. There are countless awesome resources online for design help and inspiration, so just keep digging and subscribe to blog feeds.
Good luck.
You might also want to skim some Alert Box articles by Jakob Neilsen. I haven't read them, but people also speak highly of his books.
There's also a ton of sites which can generate CSS templates for you, once you decide what sort of layout you might want. That provides you with the groundwork which you can subsequently tweak to meet your needs.