homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / WebmasterWorld / Accessibility and Usability
Forum Library, Charter, Moderators: ergophobe

Accessibility and Usability Forum

Your laptop as usability testing tool: gamma and saturation issues

WebmasterWorld Administrator ergophobe us a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

Msg#: 3716756 posted 4:25 pm on Aug 6, 2008 (gmt 0)

When dealing with graphics or post-processing photos, a laptop is essentially useless. Even if you do have a color-calibrated laptop, small changes in viewing angle result in an effect similar to large changes in gamma. You can never know what your images would look like on a color-calibrated monitor or printer.

When desiging web pages for accessibility, though, this same effect can be your friend. Why? Because you never know what the color settings and gamma are on the monitors of your visitors, whether those visitors have color vision and so on and so forth.

Here's a quick check you can do to get a rough idea of whether your site will be accessible on a variety of monitors with different gamma. If you're on a laptop, you can make this simple test in about three seconds, without having to take a screenshot, change your monitor settings or print the page or anything. This test has three difficult and delicate steps.

1. Remove hand from keyboard.
2. Grab top of laptop screen.
3. Move laptops screen back and forth through a range of about 30 degrees to each side of the normal viewing angle.

The narrow effective viewing angles on every laptop I've seen (or for that matter any LCD that is meant to withstand shock and abuse and therefore has thick "glass") means that this has a similar effect to changing the gamma and/or saturation values.

Obviously, it's a rough test, but often it's a good first check that barely even interrupts your work flow. If you desgn fails this test, meaning elements of the page disappear or become indistinguishable from one another (e.g. links and text), it means you need to tweak your colors or contrast.

If it passes this test, it's still a good idea to convert to greyscale (either screenshot or b/w printer) and check a screenshot at gammas of say .75 to 1.25. I'm not saying it should look good at those values necessarily, but all elements should be visible.

I knew that annoying laptop screen was good for something!



WebmasterWorld Senior Member 10+ Year Member

Msg#: 3716756 posted 4:45 pm on Aug 6, 2008 (gmt 0)

I also use the Wickline Color Filter Tool [colorfilter.wickline.org]. Pretty awesome tool.


WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 3716756 posted 5:34 pm on Aug 6, 2008 (gmt 0)

As one that has worked many years in the print industry doing high end color work, you might consider a more reliable approach.

We learned early on that monitor calibration, even with the highest quality monitors and calibration equipment, remained elusive. I remember one nightmare set of days with 12 monitors all connected to a single output and trying to get them all the same.

When assessing an image's color values, always go by the numbers in sampling. In Photoshop, the Info box is the target here. Constantly hover the mouse over areas, look as the values. Depending on whether you're doing it for print to RGB display, the gamut you use will vary. Generally speaking, you can color calibrate any image by:

Check absolute black and white point, make sure they are balanced (Black - 0/0/0 or 0/0/0/0 CMYK, white 255/255/255 85/83/83/95 CMYK, will vary depending on undercolor removal settings but CMY should be balanced)

Most important, target gray areas. Gray areas will tell you the overall balance of the image and can eliminate casts. For example, an area that is supposed to be gray will read 45/42/42/50, if it reads 50/42/42/50, you know you have a bluish cast. (Cyan is always SLIGHTLY higher than M and Y, due to color contamination and the tinting strength of C versus Y and M.)

Target important colors and their chroma: a good red will read <10/100/80/0, a dirty one will have high percentages of Cyan.

In time, you will learn to use the same method to test 3/4 tones, midtones, and 1/4 tones as well, just by the numbers.

Both RGB and CMYK gamuts appear in Photoshop's color sampling. Which you will use depends on what you're most comfortable with. For the most part, CMYK is more intuitive for most people because we've learned subtractive color since kindergarten and know that red + blue = orange - which is not the case with RGB (additive) color.

It takes a lot of time to become comfortable with this approach, but the best choice for color - don't rely on a monitor at all. The groundwork is constantly shifting and for the most part an unknown value.


WebmasterWorld Administrator ergophobe us a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

Msg#: 3716756 posted 6:53 pm on Aug 6, 2008 (gmt 0)

>>As one that has worked many years in the print industry doing high end color work, you might consider a more reliable approach.

Yes, I know. As I say it is not reliable, only quick. It's only a negative test. If a problem shows up there, you have a problem. If it doesn't, you still might have a problem.

Certainly you ultimately need to use other methods, but I've spent the last week surfing on a laptop and a surprising number of sites fail that simple test.

Again, to use PS as you suggest, you would need to take a screenshot of the site and then load that into PS. I don't have a clue what you would get (i.e. won't the screenshot be biased by the monitor anyway?), but it's apparently time-consuming or challenging enough that many people don't do it and have no idea that their text can look the same as their background under certain conditions. This is a 3-second test that would catch maybe one third of those problems. Maybe more.

I'm not suggesting this as a method of color calibration for images. Not talking about images at all.

Oh, and I'm not suggesting either that this is useful for knowing what things will look like when you change gamut, but under different gamma values, because that's similar to the shift you get when you tilt the monitor screen.

Global Options:
 top home search open messages active posts  

Home / Forums Index / WebmasterWorld / Accessibility and Usability
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved