Three Color Tricks for Design Excellence
What color combinations should I use?
My website looks like puke, how can I make it more tasteful?
I really love the colors on XYZ site, I wonder what their HTML codes are?
Should I make my headlines the same color as my background?
These questions and more are probably racing in every new blog owners head when they first select a theme. How can you customize your template to make it stand out from the crowd and still look good?
There are three great ways to get started.
The first way requires a little bit of work on your part, but it will pay off with big dividends. Go to any reasonably sized crafts store and purchase a small color wheel. I bought one called the “Pocket Color Wheel” from the Color Wheel Company that was just a few dollars.
Features of a color wheel include:
- Base of 12 color shades with the primary colors (red, yellow, blue) at the three vertices of an equilateral triangle, and the secondary and tertiary colors inbetween
- A Relationship Diagram that helps you select complementary, split complementary, triads and tetrads of color
- A color mixing guide that demonstrates resulting sheads when adding red, yellow, blue, white and black to each color.
A color wheel is an indispensable companion when planning your site, or evaluating someone else’s site.
One example of using the color wheel is to select your base color…the main color that you want to be impressed on your readers. In the wordpress admin template, for example, the basic color is blue. For highlight buttons, perhaps your RSS feed, your email signup or a special one time offer, selecting a truly complementary color (the opposite color on a color wheel), will make that button or special offer “pop” off the screen.
This can be seen at a number of popular websites, for example,
Complementary color schemes are just one small component of Color Theory. If you want to maximize your design potential, check out a basic color theory book from the library, or do a web search on Color Theory.
Browser Extensions can make you a Color Expert
The second way is to use a tool called Web Developer, which is a Firefox extension. This amazing add-on installs as a toolbar on your Firefox Browser. It allows you to view and edit CSS on several different levels, outline elements, label divs, and more. But one of the coolest tools is the Color Palette tool.
From the toolbar, select “Information”, and then select “View Color Information” from the dropdown. The result is a new tab with 50px square color blocks and HTML code for each of the color blocks. What a fabulous way to peep inside of website design!
Take note of how many different colors are used on various site. A great color scheme may have only 3-5 colors on it. If you see a site with two many different colors used, it’s a sign of incohesive design that could use some tightening up.
Good old Google …
The third tool that I want to mention is a simple web search for “Color Theory”. You’ll find more information that you can digest in a year on color theory, but the main concepts should be easy to find in any cohesive educational site.
Pro Blog Design just today released a guest post by Steven Snell, a web designer with Vandelay Design .
I debated whether or not to release this post today, after seeing Pro Blog Design’s post on my RSS feed, but I decided that the two articles complemented each other well. Steven has listed many more online tools that will speed up your search for great color ideas!
Popularity: 10% [?]
Leave a Reply