Choosing The Web Safe Colors

Web-Safe Colors

The idea that some colors are ‘safe’ or ‘unsafe’ for web pages was alluded in the previous posts, and we would now like to go over this idea in some more detail.

Back in the ‘Olden Days’ (about 10 years ago), screens were only able to display 256 colors. Since your operating system uses 40 or so colors, the remaining 216 colors were used to determine the ‘web-safe colors’ by taking 0%, 20%, 40%, 60%, 80%, and 100% of the three primary colors and mixing them up in every possible combination.

Since the number of people on the Internet with monitors capable of displaying only 256 colors is steadily decreasing, the importance of web-safe colors steadily decreases in turn. Even for those still using the older style screens, websites are in general not rendered unreadable by the use of non-web-safe colors. In addition, some studies have shown that only a small portion of the web-safe colors is truly safe anyway. All of these considerations have made the overall importance of only using web-safe colors rather controversial in recent years.

Other Influences on Screen Display

Perhaps even more important than the use of web-safe colors is the consideration of the large number of monitors currently used that display High Color. While High Color screens can display more colors than the old 256-color display screens, they are not the True Color screens on the market today that are capable of displaying millions of colors exactly as you want them.

Problems can arise with High Color screens when you mix colors defined within an image with colors defined in HTML code. Such colors are often displayed differently within the browser, even if they are defined to be exactly the same. You can see this phenomenon if you set your screen to High Color and surf around on the Web for a bit—although the discrepancies are generally small, they will be visible. You can mitigate this problem by using small, single-colored images in your background, or by making your background transparent where you place your pictures, even if they are set against a background defined to be of the same color.

Choosing Color Combinations

Now that we have a foundation of color theory to work with, we are ready to begin looking at how we can combine different colors together in designing web pages. This is often the most difficult part of web design to learn, and it usually takes a lot of time to get a feel for which combinations of colors are most interesting and pleasing to the eye. Nevertheless, there are some general guidelines that can be of tremendous help.

Can You Have Too Many Colors?

According to many web designers, the answer is an emphatic YES! In fact, it is generally stated that it is even more dangerous to use too many colors than it is to use too few. While a page with too few colors runs the risk of being boring, using too many colors can make your page difficult to navigate. Visitors might have considerable trouble finding the information they came to get, and the confusion may cause them to quickly tire and give up altogether. A quick rule of thumb is to try to arrange your web page using three main colors as follows:

First, choose a primary color. The primary color will be used most throughout the page, and will set the overall tone for the entire page. Next, choose a secondary color. This should be a color that is close in hue to the primary color and serves in general to “back up” the primary color in all instances. Secondary colors should not contrast too greatly with primary colors. Finally, pick a highlighting color. The highlighting color will always be used to emphasize key portions of your web page. It should contrast more with the primary and secondary colors, and therefore should be used with care and placed evenly throughout the design. Complementary or split-complementary colors are generally used as highlighting colors, and will be described in greater detail in other posts.

Share and Enjoy:

Computers And Internet

No comments yet.

No trackbacks yet.

Free Information Site