E-mail List Archives

Search E-mail List Archives for

Number of posts in this thread: 9 (In chronological order)

From: McMorland, Gabriel
Date: Tue, Jun 18 2013 11:05AM
Subject: Recommend efficient color contrast checker
No previous message | Next message →

I've found the WebAIM color contrast checker, but I'm looking for a tool that is requires fwer steps to test an image. The WebAIM color contrast checker asks for the hexadecimal value of the colors in an image.
http://webaim.org/resources/contrastchecker/

From: J. B-Vincent
Date: Tue, Jun 18 2013 11:11AM
Subject: Re: Recommend efficient color contrast checker
← Previous message | Next message →

I'm a fan of the Colour Contrast Analyser, http://www.paciellogroup.com/resources/contrastAnalyser




From: "McMorland, Gabriel" < = EMAIL ADDRESS REMOVED = >
To: " = EMAIL ADDRESS REMOVED = " < = EMAIL ADDRESS REMOVED = >
Sent: Tuesday, June 18, 2013 1:05 PM
Subject: [WebAIM] Recommend efficient color contrast checker


I've found the WebAIM color contrast checker, but I'm looking for a tool that is requires fwer steps to test an image. The WebAIM color contrast checker asks for the hexadecimal value of the colors in an image.
http://webaim.org/resources/contrastchecker/

From: Jared Smith
Date: Tue, Jun 18 2013 11:35AM
Subject: Re: Recommend efficient color contrast checker
← Previous message | Next message →

Checking contrast for text in or on images is inherently difficult to do in
an automated process - it's difficult to identify the image colors
automatically, let alone know which of the image colors you want to test
(not to mention complexities like gradients, transparency, etc.). In
general, there will need to be some human component to this. There are,
however, some tools to make this process easier. I highly recommend
Colorzilla add-ons for Firefox or Chrome (http://www.colorzilla.com/). You
can easily activate the tool, click on a location within an image, and
Colorzilla will copy the RGB value of the point you have clicked to the
clipboard, so you can then paste it into tools like the WebAIM contrast
checker. I'm looking into adding a similar tool into WAVE so you can check
image contrast right within the evaluation tool.

Jared Smith
WebAIM.org

From: McMorland, Gabriel
Date: Tue, Jun 18 2013 12:08PM
Subject: Re: Recommend efficient color contrast checker
← Previous message | Next message →

Fantastic! This is verty helpful.

From: Carol Foster
Date: Tue, Jun 18 2013 12:10PM
Subject: Re: Recommend efficient color contrast checker
← Previous message | Next message →

Is there an easy way to use ColorZilla to identify small bits of color, such
as text?

Thanks,
Carol

From: Jared Smith
Date: Tue, Jun 18 2013 12:25PM
Subject: Re: Recommend efficient color contrast checker
← Previous message | Next message →

On Tue, Jun 18, 2013 at 12:10 PM, Carol Foster wrote:

> Is there an easy way to use ColorZilla to identify small bits of color, such
> as text?

I usually just zoom the page (Control/Command +) and then use
ColorZilla to select the color I want.

You have to be a bit careful with picking colors from graphical text -
due to aliasing the text colors are often not a solid color, but each
pixel might be a slightly different color, especially near the edges
of the text. This makes it difficult to absolutely measure the text
color, though a bit of common sense can usually tell you whether the
graphical text has sufficient contrast or not, regardless of what the
RGB values are or the WCAG ratios tell you.

Jared

From: Chagnon | PubCom
Date: Tue, Jun 18 2013 1:42PM
Subject: Re: Recommend efficient color contrast checker
← Previous message | Next message →

If you're working with more highly-designed documents with graphics, color
text, and other objects, Adobe Illustrator and Photoshop have a quick
utility to view the colors for Protanopia and Deuteranopia.

Open or import the file in Illustrator (depending upon the file type: note
that PDFs can be open natively in Illustrator).
Select View, Proof Setup.
Choose either Protanopia or Deuteranopia
Then, Select View, Proof Setup again and then Check Colors.

This doesn't change the colors, but instead lets the designer view how they
will appear to people with color blindness.

-Bevi Chagnon
- - -
www.PubCom.com - Trainers, Consultants, Designers, Developers.
Print, Web, Acrobat, XML, eBooks, and U.S. Federal Section 508
Accessibility.
New Sec. 508 Workshop & EPUBs Tour in 2013 - www.Workshop.Pubcom.com

From: Ryan E. Benson
Date: Tue, Jun 18 2013 4:00PM
Subject: Re: Recommend efficient color contrast checker
← Previous message | Next message →

While I may be laughed at for this, but there is a color picker in IE 8+,
which can be used if you are in a location where you cannot install
plug-ins. In IE, press f12 to bring up the dev tools. You can either press
ctrl + K, or tools > show color picker, then paste in the value to WebAIM's
or the checker of your choosing.

--
Ryan E. Benson


On Tue, Jun 18, 2013 at 1:35 PM, Jared Smith < = EMAIL ADDRESS REMOVED = > wrote:

> Checking contrast for text in or on images is inherently difficult to do in
> an automated process - it's difficult to identify the image colors
> automatically, let alone know which of the image colors you want to test
> (not to mention complexities like gradients, transparency, etc.). In
> general, there will need to be some human component to this. There are,
> however, some tools to make this process easier. I highly recommend
> Colorzilla add-ons for Firefox or Chrome (http://www.colorzilla.com/). You
> can easily activate the tool, click on a location within an image, and
> Colorzilla will copy the RGB value of the point you have clicked to the
> clipboard, so you can then paste it into tools like the WebAIM contrast
> checker. I'm looking into adding a similar tool into WAVE so you can check
> image contrast right within the evaluation tool.
>
> Jared Smith
> WebAIM.org
> > > >

From: Steve Green
Date: Tue, Jun 18 2013 4:12PM
Subject: Re: Recommend efficient color contrast checker
← Previous message | No next message

Thanks Ryan, that is really useful - we do a lot of testing in locked-down environments and I didn't know about the colour picker.

I just found an unusual behaviour that is worth knowing about. Unfortunately you can't use the arrow keys for fine control of the picker, so you have to use a mouse to position it precisely. It is then difficult to click the mouse to pick the exact pixel you want. I found that pressing the Enter key did not pick the colour, which was disappointing, but it does pick it if you press one of the arrow keys first - even though pressing the arrow key apparently has no other effect.

Steve Green