Before you even start to worry about how your site looks you need to know color. How it works, what each one means, what they create when placed in relation, the works.
Note that this article is a revision of the 2011 article here: http://www.blog.baweaver.com/post/8809546444/practical-web-design-color-theory
Color: What does it mean?
Each color leaves a distinct impression, so naturally it is within our best interest when designing a page to take this into consideration.
Red: Red is a color that is often used to symbolize passion, love, anger, and overall strong emotional response. It is best used on sites that have to do with intense emotional issues, such as dating.
Orange: Orange is a color that represents adrenaline, action, thrills. Being a combination of the intense emotion of red and the happy-go-lucky yellow it brings with it a plethora of reactions. It is best used on sites that have to do with thrills such as amusement parks and racing.
Yellow: Yellow embodies happiness and joy, but be careful because it can also very easily be seen as cowardly. Yellow is a color that cannot stand on its own, remember that it needs something else to stand on, black being a common choice. It is best used in groups, but can be used to accent other colors.
Green: Green is growth and wealth. It is related to trees and money, making it an ideal choice for businesses, banks, and groups.
Blue: Blue is a very professional color. It is calm and collected and is right to business. It does not incite heavy emotional reactions, but promotes a sense of calm and collectiveness that makes it perfect for business and professional usage.
Purple: Purple is a very noble color, almost suffocating at time. Unlike yellow it is a very bold color that needs to be used in moderation, otherwise it will quickly overwhelm other elements on a page. Purple is great in moderation and in conjunction with blue.
Black: Black is all over the map, it means anything from evil to collected professionalism. I prefer to refer to it as a neutral color that doesn’t harbor emotion to it. It has a certain elegance about it.
White: White is a color of innocence and purity. It is considered the clean color, but as with black it is neutral, adding no real emotion to the page.
Don’t believe me? Go to Google Image Search and select a color on the side, see what types of images most often pop up for each type of color.
Groupings
Colors are best used in groups of no more than 2 to 3 different colors, not including neutral colors like black and white.
The best inspiration for color sets is from photography. Get out a camera and take a photo of what you believe embodies the site you’re trying to make. Use that photo and pick out 3 to 5 colors from it, remember to keep a balance of light and dark colors in your choice. This is your swatch.
There are various resources online that are of substantial help in finding good color combinations, among which stock photos can be the most useful.
Sites like Adobe Kuler are nice in the short run but leave you completely reliant on someone else’s work to accomplish your task. You’ll only be able to truly capture the feeling of your site with images that speak to you, whether they are yours or stock.
Complimentary and Oversaturated Colors
As much as people will swear to the effect of complimentary colors, they are best avoided in excess. Small amounts of these colors will give you an edge to your site, but done in excess will blind your user. Orange and Blue done right is one of the most commonly used, check out half of the modern movie posters (like batman.)
The same is true of oversaturated colors used in excess. Remember to use neutral colors liberally and go easy on strong colors like red and purple. It is very easy to overwhelm a visitor, be careful of using too much.
Conclusion
Different colors can mean a world of different things, and selecting the right colors can make a substantial difference in your site. The number one thing to remember in design is to use things very sparingly, the point is to accent your content, not a flying circus of a page made in the depths of geocities.
The next tutorial will cover basic rules of composition.