Wednesday, April 20, 2011

How do I test the visual accessibility of web pages under development?

When developing websites, I'd like to be able to quickly switch to "what does this look like to a person with certain types of color blindness?"

I've found Visicheck, which will show you approximations of what an image or a public web page will look like.

Is there something I could use on my local development before a site goes live? A Firefox plugin perhaps?

From stackoverflow
  • You could screen-shot it and send it to me :)

    James A. Rosen : Humorous, but not easily automated. And I suspect you'd get tired of me sending you hundreds of screen shots every week :)
  • This used to work on ffx2 https://addons.mozilla.org/en-US/firefox/addon/7313. Doesn't show you what it loks like, but it does give you a table of elements of the site, highlighting those that coudl be problematic.

    Why not download ffx portable 2 and install it on that.

    *edit turns out a beta of it is available for ffx3

  • I haven't tried it myself yet, but here's a Firefox extension that is supposed to do just that.

    There are various-types of color-blindness. So the best way to maximize the accessibility of your site is to simply test the contrast levels of your design (background vs. text). Here's an article containing a list of resources/tools for doing so. This will help your visitors read your content in poor lighting conditions, using poor displays, and who are color-blind or have poor eyesight.

    One advantage to checking contrast levels is that it works for all types of color-perceptions, and it won't force you to use colors & hues that don't match in regular color-perception.

0 comments:

Post a Comment