Web Developer's Virtual Library: Encyclopedia of Web Design Tutorials, Articles and Discussions


WDVL Newsletter

Active Server Pages
JSP/Java Servlets
Microsoft SQL Server
Daily Backup
Dedicated Servers
Streaming Audio/Video
24-hour Support    

jobs.webdeveloper.com

Hiermenus


e-commerce
Partner With Us















Developer Channel
FlashKit.com
JavaScript.com
JavaScriptSource
Developer Jobs
ScriptSearch
StreamingMediaWorld
Web Developer's Journal
Web Developer's Virtual Library
WebDeveloper.com
Webreference
Web Hosts
XMLfiles.com

internet.com
IT
Developer
Internet News
Small Business
Personal Technology

Search internet.com
Advertise
Corporate Info
Newsletters
Tech Jobs
E-mail Offers


Using Color on the Internet

January 14, 2002

One of the great things about the Internet is that it allows Web designers to use color at no additional cost, whereas similar practices in print media can be expensive. This ability helps bring Web sites to life and make them more visually interesting.

That same free use of color is also one of the negatives about the Internet because not all Web designers make the best choices for color use.

216 Web-Safe Colors Chances of choosing bad color combinations are great even if users stick to the basic colors on the Internet. Those basic options are 216 "Web safe" colors (shown at right), safe because browsers will not change them (called dithering) to another color.

Should users select a color that is not included in this 216- color palette (I've been told there are more than 16 million colors), browsers will dither that color to the nearest match within the palette. Then, what is seen is merely a factor of what video equipment and settings the reader is using.

Because not all video cards are created equal and not all users have their video set up to see the same numbers of colors, there can be subtle differences in the colors seen, and some not subtle enough to prevent the combinations from looking fairly ugly.

Remember that monitors only show 72 dots per inch, which means detail of color can also be lost in the translation.

More and more, there are fewer systems and monitors that can only handle 256 colors in the world, with many capable of what is called "True Color." Still, it remains safest for Web designers to create for the lowest denominator, if possible.

An Easy Way to Solve the Problem

Color Wheel That is when a tool to help select harmonious color combinations is worth its weight in gold. One of my favorite tools is a color wheel, much like I used in print media years ago, and available today for a very small cost.

A color wheel that uses the Web-safe colors, such as the one seen at right here, serves many purposes for the Web designer. Not only does it allow the user to see the color they may wish to use, but it also lets them see the following:

  • It shows an example of a color.
  • It shows the hexadecimal code and RGB conversion code for each color.
  • It shows which colors complement a chosen color.
  • On the reverse side, it shows color triads, a set of colors that combine to create nice combinations.
  • Also on the back, it has an indicator to show relative amounts of colors used to create a chosen color.
  • It shows a value scale, to help users compare relative lightness and darkness of colors.

The color wheel has been around since about 1900, and it still works today. Essentially, for just a few dollars, a user can purchase a tool that, when used properly, can eliminate those terrible color combinations that make so many sites appear amateurish.

Color wheels are usually available at craft shops, if your local computer store does not offer them, but one showing the Web-safe colors is the better choice.

Reproducing Exact Colors

Because my company redesigns a lot of Web sites for new clients, we often find ourselves having to match particular colors, such as those in a company logo. For that, it is necessary to use color selectors, a.k.a. color pickers.

There are seemingly an endless number of such software programs available on the Internet, many of which can be had for free. But sometimes what you see is not what you get.

The reason for that is because color pickers tend to have an eye dropper function that allows the user to select a tool and then click on a graphic to get that color. The problem is that pixel level selection without significant magnification can result in an entirely different color than what the overall graphic appears to be.

At that point, it is better to go with a color picker that enables users to select a multi-pixel area, chosen from a magnified view. The program can then average the colors, and many will provide the user with the closest match among the Web-safe colors.

Once the basic color is identified, it is then easy to go the color wheel to get an idea of complementary colors that could be used for the site.

When using a tiled or graphic background, it is important to identify the most prevalent color and select the most complementary color or colors for other elements on the site, such as text and navigation buttons.

Backgrounds with thick patterns are difficult for most anyone to read.

Color Can Affect Ease of Reading - Page 2


Up to => Home / Authoring / Graphics




Jupiter Online Media: internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and Jupiter Online Media

Jupitermedia Corporate Info


Legal Notices, Licensing, & Permissions, Privacy Policy.

Web Hosting | Newsletters | Tech Jobs | Shopping | E-mail Offers