Effectively Using Colors on the Web
As with any printed work or structural design, the primary purpose of (virtually) all web pages is to convey some kind of information or feeling to others. It is not surprising, then, that color should play an important role in how well this is done for web sites, too. An effective use of color can aid tremendously in getting a message across; it can help people get the most out of their visit to a particular website, or ultimately sell them on a particular product.
The very nature of the Web and how people use it, though, makes the use of color even more important on the Web than in traditional printed work, interior design, or architecture. This is largely due to the variations in the monitors manufactured and currently used. A poor choice of colors in designing a website may not only make it less effective overall—it can also make it unreadable to visitors and can ultimately drive them away.
How Monitors and Screens Display Colors
We discussed in the introduction how monitors use tiny red, green, and blue dots in different combinations and different intensities to convey all the different colors we see. Each point on a particular screen is actually a group of three little colored dots, situated so close to one another and to neighboring groups of dots that our eyes are unable to distinguish them separately, and we see them as a homogeneous distribution of color.
Such a configuration of primary-colored dots allows a monitor to generate virtually any color in the visible spectrum. For example, if all the red, blue, and green dots on a screen are emitting the full 100% of their potential intensity, you will see a pure white screen. This potential intensity varies on a scale from 0 to 255 for each dot of each color, with lower numbers corresponding to lower emitted intensities.
So, all colors can be represented by a series of 3 numbers ranging from 0 to 255, and the fully white screen in our example would be designated 255, 255, 255 for “full red”, “full green”, “full blue.”
A very bright, pure green screen would be designated 0, 255, 0, and a much darker green would be designated something like 0, 100, 0. Finally, this kind of structure gives 256*256*256 possible color combinations – or over 16 million possible colors!
Designating Different Colors on the Web
On the Web, these groups of numbers are a little different, though, because they are represented in HTML and CSS by their hexadecimal values. The least informative definition of a hexadecimal number is a number having base 16, but it’s a necessary start in learning to work with such numbers.
Our everyday system of numbers is base 10, and is a direct consequence of our having 10 fingers. The ‘base’ is made up of the 10 digits (0, 1, 2, 3, 4, 5, 6, 7, 8, 9) with which any possible number can be represented. As we count upward in our base 10 systems, each time we reach another ‘ten’ we either add another digit to our number or increment our multiples of 10.
The hexadecimal system has 16 as a base instead of 10. The sixteen unique digits that make up the hexadecimal system are 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E and F. Hexadecimal notation in HTML and CSS for specifying colors on web pages is in the form of “hex triplets” having the format #RRGGBB (for the red, green, and blue components, respectively). The trick to maneuvering around hexadecimal numbers and their conversion to decimal numbers is to remember that A, B, C, D, E, and F correspond to 10, 11, 12, 13, 14, and 15, and you increment the letters just as you would increment the integers – with integers themselves.
For example,
1A = 1*16 + 10*1 = 26
1B = 1*16 + 11*1 = 27
4B = 4*16 + 11*1 = 75
FF = 15*16 + 15*1 = 255
So, if a color is represented in hexadecimal notation as #FF4B1A, its decimal triplet would be (255, 75, 26). As you can see from our example, FF corresponds to the highest intensity level, 255. The “beauty” of this system is that all numbers – from 0 to 255 – can be represented by only two digits.
Related posts:
- Primary Colors And The Color Wheel Web Designing
Primary Colors Of all the colors in the visible spectrum, three colors are special in that all other colors in the spectrum can be created from different mixtures of these three. These are the three primary colors. For our purposes here, the primary colors are red, green, and blue on... - Colors In Web Designing
Color effects how we perceive the world around us. It can affect our emotional and physical responses to visual stimuli, and can even govern how we interpret these stimuli. This is why color is so important in fields of graphic and environmental design, and why graphic designers, interior designers, and... - 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... - Using The Color Wheel In Web Designing
Learning to Use the Color Wheel The color wheel introduced earlier is a very useful tool for choosing colors that combine in a way that is pleasing to the eye. Following are some ways for using the color wheel to discover the most effective color schemes for your designs. Using... - Colors And Internet Marketers
Internet marketers are always on the lookout for ways of creating good impressions on viewers, as the business is always dependant on good impressions! The customer spends only a few minutes to gauge on the competence of a company through the marketing tool. So this few minutes prove to be... - 7 Popular Decorating Colors
Picking the right color for a room can often be the most difficult decorating decision. The best way to find a color you like is to look at other homes, restaurants, and good old-fashioned paint chips. Here are some popular colors in decorating right now. The specific colors I refer... - Psychological Impact Of Colors
Colors and the psychological Impact: - White is considered as the color of purity, honesty innocence and openness. The white projects the dirt and filth and it conveys the absence of all these negativity. It also represents virginity and the marriage in the USA. It is slightly paradoxical that eastern... - Colors and their psychological influence in Marketing.
Colors speak in many languages. As we verbally communicate to people in different dialects, so also the effect of colors in non-verbal communication. The best example would be the nature. Nature the creative artist has made the best ever color combinations on earth, whether it is in flowers, in butterflies... - My Super-Effective Article Writing Formula
Here’s the formula that I use to quickly write informative articles that get results. For many of the articles that I write my goal is to get visitors to a website where they take some action related to the topic of the article. Often the action that they take is... - Delivering Effective Performance Feedback – Simple Steps for Success
Does anyone really like giving or receiving feedback? Probably not; especially if it is considered constructive feedback. Yet, providing feedback is an essential part of managing performance. You cannot do one without the other so making feedback simple and direct might be one way to ease some of that dislike... - Sincerity: the ‘Secret Sauce’ for Effective Marketing
A couple years ago, I was talking with someone who was, for me, a very challenging client. I’m all about cultivating relationships that result in opportunities to sell. This particular client seemed allergic to cultivating relationships for reasons I never really understood. I remember one such meeting, I was trying... - Effective Business Writing Tips for Professionals
Effective business writing skills can help you win that million dollar contract, earn a promotion, resolve a dispute, or generate a significant increase in new business leads. Poor business writing, on the other hand, can never be undone; it can cause you to lose business to your competition and even... - Is Psychological Pricing an Effective Strategy?
Price has a psychological significance attached to it. Buyers have this belief that if a product is highly priced then it is more valuable. Although this belief is more psychological than reality based it makes price tangibles more effective than the product itself. However, it is interesting that as the... - Four Tips For Creating An Effective Authors’ Resource Box
In article marketing, there are many factors that will affect your articles’ ability to promote your website in the most effective manner. In this article, we will briefly discuss a couple those factors, before we dive into how to create an effective Authors’ Resource Box, also known as the About... - Business Advertising and Branding: What Online Tools Are Effective?
Marketing has always been an essential element of business – both back in the day when brick and mortar stores and mail order businesses were the only options and now that the internet has become so central to so many people’s lives. Business advertising – along with many businesses as...