16 replies to this topic

[bragadocchio]

I was reading an article about browser safe colors at linda.com called Non-Dithering Colors in Browsers, and I started wondering if people bothered with them anymore?

Do you limit yourself to the Browser Safe color palette?

Did you ever?

Don't people look at the web in more than 16 colors or 256 colors these days? Any guesses as to how many people might be using less colors? Is it worth making a site that limited in colors?

[wanderer]

I figure that sticking with browser-safe colors is akin to building for old browsers. Anybody who can't see more than those colors is used to things looking off. I use whatever color strikes my fancy.

[DianeV]

Haven't done so in this millenium, Bill.

I suspect our visitors are pleased, as it appears that slightly more than 1/6 of the websafe colors are some variation of lime green? This is no doubt what lay behind the old "hip" webby trend of using blow-your-eyes-out background colors.

[Ron Carnell]

I sure hope no one is lamenting the death of something that never really existed? The so-called web safe colors weren't really very safe. Still aren't.

The article that got Bill thinking about this called this palette the 6x6x6 cube (6*6*6 = 216 colors) and complains that the choice of colors, from a design point, is less than optimal. To understand the importance of that, you have to realize that while a 256 color video card can only display 256 colors at a time, it can display ANY 256 colors. That's why your RGB values in the Web Safe Palette cover the whole range, with black being 00-00-00 and white being 255-255-255 (or FFFFFF). Essentially, the Palette sets asides 6 values out of the permitted 256 for each of the primary colors.

Which six? That's the kicker.

Someone in their infinite wisdom decided the six values should be spaced evenly along the 256 value scale. So, our web safe color scale is 0, 51, 102, 153, 204 and 255. Hex values look cooler, coming in at 00, 33, 66, 99, CC, and FF. An even better way to look at these values is to consider them percentages, going from 0 percent to 100 percent in exact increments of 20.

I actually remember going from Hercules (monochrome) to CGA (16 colors) to EGA (256) colors, and I also remember that it didn't take very long, probably less than a year, before we had VGA video cards. And that year is also just about how long the web safe colors were actually safe.

After the EGA 8 bit color came High Color, with 16 bits, and True Color, with 24 bits. To preserve our original web safe palette, we need to be able to distribute the colors over that same 20 percent per value range for both of the higher color palettes. The math gets a little hairy, but essentially it can't be done on a 16 bit system. Design for 8 bit or 24 bit color, which obviously includes our web safe palette, and your colors will be slightly shifted when displayed by a 16 bit video card. How much they are shifted will depend on the individual color, but the shift is usually noticeable. Of the 216 original web safe colors, only two come across with no shift (black and white), with another 20 colors considered "close enough" that the casual eye won't see a difference. Sadly, the lime greens Diane doesn't like seem to dominate those 20 colors even more than they did the 216.

Is that a big problem? Last time I checked, High Color still accounts for about 39 percent of all page accesses. It's a big enough problem that, when I'm designing a new color scheme for a site, I switch back and forth between High and True color quite a bit. My final design will be for 24 bit, but I want to make sure it doesn't look "too" terribly bad on a 16 bit system.

Oh, yea, anyone ever run across an AOL user complaining about the poor quality of your images? Most of us who have been designing sites for a while know that AOL browsers, by default, will enable something they call image compression. Essentially, to save bandwidth, they compress our images on their proxy servers before sending them on to the user. Anyone ever wonder how they can compress an already compressed jpg image?

If you guessed they do it by dropping the colors down to 256, you win a cupie doll! And the moral of our story is there's a few more 256-color users out there than you might have thought.

[DianeV]

As an aside, it's not that I don't like lime green. It's just that I would have liked some of those +/- 42 shades of lime green to have gone to other colors.

[tam]

There's an article somewhere (webmonkey maybe) that worked out only about 12 or so websafe colours were really websafe.

I occationally flick my graphics prog to a websafe pallet but usually there's nothing that comes close to the colours of my design so I pick what I like.

As long as the colours have enough contrast in background/text i don't think it matters.

Tam

[DianeV]

I may have seen the same article, Tam -- a table full of cells, each with its own websafe color and a gif with that same color, and only a small number of gifs/background color actually matched.

[tam]

Thats it

I found the article - http://hotwired.lyco....html?tw=design

And these are the 22 colours you can safely use -
http://hotwired.lyco...fe_palette.html

Tam

[winteromeo]

Maybe nowadays people don't use much web-sfae color that often. Most user can display at least a 16-bit color mode screen though, so that's not a problem.

Using web-safe color can reduce image file size.

[Black_Phoenix]

Using web-safe color can reduce image file size.

i cant see why this would happen, if you take a square that is 150 pixels x 150 and colour it all in a mixed red, and then fill it all in a pure web colour

the image is still the same size, i just tried it saving them as .jpgs (how sad am i)

i personally dont take any notice of web colours when designing stuff, i do use web safe colours for fonts though.

Nearly everyone now has machines that run more colours than 16 / 256 colours so i dont see that it matters, also some of the briefs for sites i've done state that the site reflects exact pantone colours used in their printwork, i dont think they would be happy if i did the closest websafe colour instead.

bp

[tam]

If you only use websafe colours then your limiting the amount of colours you use in total (I'm presuming your not going to use every 216 colours in just one image), the less colours in a gif the smaller it is.

Theres only about 16 colours that are truely 'web safe' so its pretty pointless limiting yourself to them unless you don't mind every site tou do looking the same and being green.

Tam

[DianeV]

> and being green

Exactly.

the image is still the same size, i just tried it saving them as .jpgs (how sad am i)

BP, I like your style!

[Black_Phoenix]

sigh!

someone had to do it, he/she might have been right (i did 4 quick versions)

i've never heard of it before, i could be a beta tester

mb not :oops:

bp

[Black_Knight]

someone had to do it, he/she might have been right (i did 4 quick versions)

Trouble is, you tested JPG format, while the tip about colours applies to GIF format.

If you reduce the colours in a GIF file, the colour palette it has to save is smaller, and this is reflected in the total filesize. A lot of the work in optimising the filesize of a GIF is in reducing the number of colours.

JPEGs are different, and the only ways to really optimise the filesize (apart from using smaller images) is to reduce the quality and play with the smoothing.

[alexasigno]

I never really worry about colours, as every user who looks at the site will see it different anyway. With brighter, darker screens, higher lowere contrast, colour settings, temperature etc. And on top of this we all see colours different to each other anyway :roll:

[winteromeo]

Agree with you, alexasigno, yes the monitor is another issue. Anyway, I usually optimise jpg file to make it look nice, else there's no point in making it jpg, might as well use gif instead.. 8)

[xelA]

Technically web safe colors were never really web safe.

There is a link here as well as some good info
http://www.cre8asite...p?showtopic=624

Here s the link from that post:
http://hotwired.lyco....html?tw=design