forget 256-colors and ancient font-stacks…
Shop for web design and development books here.
Web-safe: Colors and fonts that should display properly in all browsers. No web designer/developer worth any salt would think of using otherwise, right? Well… The web-safe colors of ten years ago are outdated. According to various surveys, very few users (under 2%) are still using 256-color displays. We should now be designing for 1024x768, 16.7M colors, and using modern font-families, as the “web-safe” basis for all new web designs.
There are literally thousands of web sites and software applications still offering the 216-color “web-safe” palette. This practice was valid several years ago, but now it persists like a tradition, leading some people to believe it’s still valid. There are also millions of web sites designed on the fixed-width paradigm for 800-pixel-wide monitors.
From the W3Schools January 2008 survey,
- Over 86% are using 1024x768 or higher; 8% are using 800x600 (dropping rapidly); 6% unknown.
- Over 90% are running 16.7M colors; 8% are using 65,536, and 2% are using 256.
- Forget “web-safe” colors. Use all 16.7 million. The rare user seeing dithered colors on their 256-color displays will soon upgrade their hardware, mostly to a 1280 (or higher) LCD panel, or figure out that 2 seconds of clicking will change what they already have to at least 1024x768x16.
- Forget 800px fixed-width web designs. If one must use fixed-width, put it at about 960, for the 1024 screen (leave a little room for borders and scrollbar).
- Forget Helvetica and Times. See my article on the new font-family.
- Avoid software still promoting “web-safe” colors, screen-widths, and fonts. It was once useful, but now has become a tradition with no justification.
- Always use CSS to override ugly browser defaults, like:
- tables with separated borders
- Times font in weird sizes for headings and body
- wierd line spacings between things, particularly list items
- blue/red/purple/underlined links
- pages with text crammed up against things; no margin
There are also many modern trends to avoid, because most people are annoyed by them:
- Excessively busy pages crammed and cluttered with floating boxes full of stuff that isn’t styled or themed to match the site.
- Ad blindness: This is where users subconsiously ignore any and all ads, because they appear in the peripheral vision as annoying and obnoxious boxes of loud colors and other gimmics designed to attract attention, but instead just cause ad blindness. If one wants an ad to be seen, blend it with the page!
- The worst: Double-underlined hover links that use AJAX popups to shove ads in your face if you accidently mouse over them, disrupting your browsing.
- Excess interactive gadgetry: “features” that have no real purpose, just for the sake of selling interactive features. The so-called Web 2.0 fad has largely become just a competition to see who can cram the most gadgetry into a web page. Most users don’t browse to play with gadgets, they browse to read and learn.
- 760px-wide web templates with a vast wasteland on each side—or worse, all the waste on one side, indicating that the designer can’t use simple CSS to center a page, much less create a fluid layout.
- Tiny 10pt/12px fixed-size text—users unable to override in browser.
- Bright kiddie-colors, dark backgrounds, interference patterns, unreadable text, poor contrast, etc.
- Flash intros that have no purpose and are tiring and annoying after one viewing.
- Poor writing, poor punctuation: Writers that don’t know when to use an apostrophe—much less an rsquo.
Web design is both art and science. It should exemplify skill and precision, just as is employed in professional print publications. There is no excuse for anything less, particularly when asking someone to pay for it.
It takes more than just coding and scripting to make a good web site—it also takes the precision of an artist and the skill of a writer. We’re asking people to make a fast decision to spend a bit more time looking at our material. Respect their time. Entice them. Exceed their expectations.