Color is the main Mac web design problem
I usually don’t tell my clients that I design on a Mac. Too many don’t know that a web page should be platform agnostic. Oh, there will generally be a tweak or two in the style sheet to pander to any of a host of Internet Explorer CSS shortcomings. But anybody who attempts to build standards compliant web pages faces the same problems whether they use Macintosh, Windows or Linux. Like most knowledgable web designers I build sites to work well in a modern browser like Firefox, then apply the necessary tweaks to trick IE.
IE for Windows is a horror when it comes to following web standards. But it is a well documented horror and there are some tested workarounds for most of its weirdness. It’s just a matter of knowing CSS and testing on the orphan Windows box stuck in the corner behind the conference table.
The major problem with using a Mac for web design is not code based but color. Web pages are just plain text, after all, which I’ve even written on a Palm PDA. The problem is that Windows computers have different standard color settings than Macs. I’m not talking about so-called “web safe” colors. That’s pretty much a non-issue now days. I’m talking about color intensity and saturation. I don’t know if it was Apple or Microsoft that chose to use a different standard for displays but Windows computers display a darker and more saturated screen than do Macs. The technical term is Gamma, which according to Wikipedia is:
“Gamma correction, or often simply Gamma, is the name of an internal adjustment applied to compensate for nonlinearities in imaging systems, in particular those of CRTs in TV and computer displays.”
To put it simply, to see what most of the world sees, it’s necessary to adjust a Mac’s color settings to match Windows. This is not an evil act. Nor is it selling out to the devil in Redmond. Display settings are simply display settings, not a religious issue. If you are doing web design on a Mac and want to see (more or less) what most of your visitors will see you need to adjust your monitor’s gamma settings to match.
Now, color management or correction can be very complicated if you want to match monitor and printer colors. Colorsync does make it much easier on a Mac. But since your output device on the web is another monitor and you can’t control those, you just need to get in the ballpark. And that’s simple.
In System Preferences select Displays, then click on the Color tab. By clicking on the Calibrate button, your Mac will walk you through a calibration wizard. Just make sure you click on the 2.2 gamma setting rather than the 1.8 that is standard for Macintosh. You won’t see quite the saturation of a Windows display but it will be close enough for web work.
If you want to get more deeply into color management try Color Management with Mac OS X Tiger(3.2 MB PDF from Apple).
6 Comments Add your own
1. Jack | June 16th, 2006 at 9:18 am
– I don’t know if it was Apple or Microsoft that chose to use a different standard for displays but Windows computers display a darker and more saturated screen than do Macs.
The reason for the difference in Gamma has to do with the publishing world. Apple chose to use a Gamma that most publishing/print houses use (1.8), where as Microsoft chose 2.2 for video purpose - which, btw, is what televisions use. With the popularity of video editing on the rise, or even the fact that Apple is starting to cater to Microsoft clients, they may choose 2.2 in the future - or at least, change it based on some setup questions…
2. Wil | June 16th, 2006 at 9:30 am
This has been a well-known problem since the dawn of the Internet. Another PC-Mac difference was the 72 dpi versus the 96 dpi. As always, design on a Mac, test on/for a PC
3. Poster | June 16th, 2006 at 9:45 am
Interesting point. When I look at web sites I’ve designed on other monitors, it’s usually the brightness and the contrast that stick out the most. I’d never thought about gamma before.
4. joe | June 17th, 2006 at 1:01 am
In real life, the visual difference between 1.8 and 2,2 is not all that great. If you compare half a dozen monitors running off the same computer as I have often done for exhibitions, each monitor will look different anyway and more different than simply toggling between ‘Mac’ and ‘PC’ gammas. The other factors are screen brightness, screen colour temperature, screen age, brand, model, backlight and type of LCD or CRT. Even Mac monitors that have been calibrated with the same hardware calibration device will ‘look’ different side by side. A dark blue background on my old site was variously described by viewers as black, purple and maroon. You have no control over what other people’s monitors are showing and most of the time, it doesn’t matter.
5. michael | June 17th, 2006 at 10:10 am
I agree that for many people the small gamma difference isn’t important. But its still helpful to be a bit closer to seeing what your visitors see.
As to the 72/96 dpi idea. That’s not a concern for modern web visitors. According to Dave Hyatt, the lead developer on the Safari team, Apple is using the 96 dpi standard for Safari. And all the Mozilla based browsers do too. The only people affected by this are those still on OS 9 or earlier. That’s such a small market and those people are so used to seeing tiny text anyway that it’s a non-issue.
6. unseen » Blog Archi&hellip | July 19th, 2008 at 10:19 pm
[...] A little poking around the net revealed I’m not the only one to have had this epiphany. http://mactheweb.com/design-theory/color-is-the-main-mac-web-design-problem/ [...]
Leave a Comment
You must be logged in to post a comment.
Trackback this post | Subscribe to the comments via RSS Feed