WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Contrast page checker?

for

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

From: Angela French
Date: Wed, Aug 26 2015 10:41AM
Subject: Contrast page checker?
No previous message | Next message →

Anyone know of a color contrast validator where you can put in the URL and it will show the issues for the page (as opposed to entering the color value in a tool like that on WebAIM?

Thanks,



Angela French
Internet Specialist
Washington State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
www.checkoutacollege.com<;http://www.checkoutacollege.com/>;
www.sbctc.edu<;http://www.sbctc.edu/>;

From: Jordan Wilson
Date: Wed, Aug 26 2015 10:56AM
Subject: Re: Contrast page checker?
← Previous message | Next message →

http://wave.webaim.org includes both of those abilities if I understand
you correctly.





On 8/26/15, 12:41 PM, "WebAIM-Forum on behalf of Angela French"
< = EMAIL ADDRESS REMOVED = on behalf of = EMAIL ADDRESS REMOVED = >
wrote:

>Anyone know of a color contrast validator where you can put in the URL
>and it will show the issues for the page (as opposed to entering the
>color value in a tool like that on WebAIM?
>
>Thanks,
>
>
>
>Angela French
>Internet Specialist
>Washington State Board for Community and Technical Colleges
>360-704-4316
> = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
>www.checkoutacollege.com<http://www.checkoutacollege.com/>;
>www.sbctc.edu<http://www.sbctc.edu/>;
>
>>>>

From: Angela French
Date: Wed, Aug 26 2015 11:29AM
Subject: Re: Contrast page checker?
← Previous message | Next message →

I've always found that interface really confusing visually. If I test this url: http://dev.sbctc.edu/_testing/test-template-errors.aspx the Summary seems to indicate that I have 16 contrast errors. But I don't know how to make it show where those contrast issues are. If I check the same page on achecker.ca I get zero contrast errors.

Angela French

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jordan Wilson
Sent: Wednesday, August 26, 2015 9:57 AM
To: WebAim Forum ( = EMAIL ADDRESS REMOVED = )
Subject: Re: [WebAIM] Contrast page checker?

http://wave.webaim.org includes both of those abilities if I understand you correctly.





On 8/26/15, 12:41 PM, "WebAIM-Forum on behalf of Angela French"
< = EMAIL ADDRESS REMOVED = on behalf of = EMAIL ADDRESS REMOVED = >
wrote:

>Anyone know of a color contrast validator where you can put in the URL
>and it will show the issues for the page (as opposed to entering the
>color value in a tool like that on WebAIM?
>
>Thanks,
>
>
>
>Angela French
>Internet Specialist
>Washington State Board for Community and Technical Colleges
>360-704-4316
> = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
>www.checkoutacollege.com<http://www.checkoutacollege.com/>;
>www.sbctc.edu<http://www.sbctc.edu/>;
>
>>>archives at http://webaim.org/discussion/archives
>

From: John E Brandt
Date: Wed, Aug 26 2015 12:50PM
Subject: Re: Contrast page checker?
← Previous message | Next message →

In addition to the others folks have mentioned, the HTML Code Sniffer browser plugin does a halfway decent job of find contrast issues and "points" to them.

But one of the issues I find with the auto validators on this topic is they will find things that are sometimes inconsequential. Example being the template has layered some gray with black as a background, but there is no text elements or anything to "read" - it's all decorative. The auto validators will point to these as well.

http://squizlabs.github.io/HTML_CodeSniffer/

~j

John E. Brandt
jebswebs: accessible and universal web design,
development and consultation
= EMAIL ADDRESS REMOVED =
207-622-7937
Augusta, Maine, USA

@jebswebs
www.jebswebs.com


-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Angela French
Sent: Wednesday, August 26, 2015 12:41 PM
To: WebAim Forum ( = EMAIL ADDRESS REMOVED = ) < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] Contrast page checker?

Anyone know of a color contrast validator where you can put in the URL and it will show the issues for the page (as opposed to entering the color value in a tool like that on WebAIM?

Thanks,



Angela French
Internet Specialist
Washington State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
www.checkoutacollege.com<;http://www.checkoutacollege.com/>;
www.sbctc.edu<;http://www.sbctc.edu/>;

From: Jared Smith
Date: Wed, Aug 26 2015 1:47PM
Subject: Re: Contrast page checker?
← Previous message | Next message →

Angela French wrote:
> If I test this url:
> http://dev.sbctc.edu/_testing/test-template-errors.aspx
> the Summary seems to indicate that I have 16 contrast errors.
> But I don't know how to make it show where those contrast
> issues are.

This is a very interesting bug that we've not encountered before.
We'll be pushing a fix for this very soon.

Thanks,

Jared Smith
WebAIM.org

From: Angela French
Date: Wed, Aug 26 2015 2:08PM
Subject: Re: Contrast page checker?
← Previous message | Next message →

Jared, it was suggested to me that I try the contrast checker add-on for Firefox. I did so and I got some valuable insight there because it showed whether the items were failing on small or large text. Mine are failing on small text which tells me it's the media queries for small devices.

Angela French

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jared Smith
Sent: Wednesday, August 26, 2015 12:47 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Contrast page checker?

Angela French wrote:
> If I test this url:
> http://dev.sbctc.edu/_testing/test-template-errors.aspx
> the Summary seems to indicate that I have 16 contrast errors.
> But I don't know how to make it show where those contrast issues are.

This is a very interesting bug that we've not encountered before.
We'll be pushing a fix for this very soon.

Thanks,

Jared Smith
WebAIM.org

From: Schalk Neethling
Date: Thu, Aug 27 2015 2:41AM
Subject: Re: Contrast page checker?
← Previous message | Next message →

Another invaluable tool for this is the Paciello Groups' color contrast
checker ~ https://github.com/ThePacielloGroup/CCA

On Wed, Aug 26, 2015 at 10:08 PM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:

> Jared, it was suggested to me that I try the contrast checker add-on for
> Firefox. I did so and I got some valuable insight there because it showed
> whether the items were failing on small or large text. Mine are failing on
> small text which tells me it's the media queries for small devices.
>
> Angela French
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Jared Smith
> Sent: Wednesday, August 26, 2015 12:47 PM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] Contrast page checker?
>
> Angela French wrote:
> > If I test this url:
> > http://dev.sbctc.edu/_testing/test-template-errors.aspx
> > the Summary seems to indicate that I have 16 contrast errors.
> > But I don't know how to make it show where those contrast issues are.
>
> This is a very interesting bug that we've not encountered before.
> We'll be pushing a fix for this very soon.
>
> Thanks,
>
> Jared Smith
> WebAIM.org
> > > at http://webaim.org/discussion/archives
> > > > > >



--
Kind Regards,
Schalk Neethling
Senior Front-End Engineer
Mozilla ::-::

From: Judith.A.Blankman@wellsfargo.com
Date: Thu, Aug 27 2015 10:41AM
Subject: Re: Contrast page checker?
← Previous message | No next message

I use 4 checker tools (WAVE for Firefox & Chrome, Paciello desktop
checker, and the WebAIM web page) in different ways. I also make sure
designers have these tools and are checking their work.

I couldn¹t test your page, was blocked from our proxy server, so I can¹t
identify what might be happening in your situation.

Not sure how you are using the Chrome WAVE plugin, which I LOVE BTW, so
here¹s what I do. Select ³Contrast² from the choices at the top of the
sidebar to reveal the Details interface. Click on the icons that display
to locate errors. I am not sure why all of the icons don¹t display on the
page being tested (layers or animation perhaps?) but many of them do.
Guessing it¹s reading the CSS perhaps?

In general I trust my eye and then test using Paciello¹s dropper tool most
of the time. Or to be 100% sure, if I don¹t have a palette or a designer
to ask, I grab the colors from the CSS (if they are presented as hex
values and not percentages) using a code inspector and then plug them into
the WebAIM Color Contrast Checker.

Hope this helps.

Best,

Judith Blankman


Accessibility Strategist

Customer Experience (CX)

WFVC Digital | 550 California Street, 2nd floor | San Francisco, CA 94104
MAC A0112-020

Tel: 415-947-6583 | Cell: 415-601-1114


<mailto: = EMAIL ADDRESS REMOVED = > = EMAIL ADDRESS REMOVED =
<mailto: = EMAIL ADDRESS REMOVED = >




On 8/27/15, 1:41 AM, "WebAIM-Forum on behalf of Schalk Neethling"
< = EMAIL ADDRESS REMOVED = on behalf of = EMAIL ADDRESS REMOVED = >
wrote:

>Another invaluable tool for this is the Paciello Groups' color contrast
>checker ~ https://github.com/ThePacielloGroup/CCA
>
>On Wed, Aug 26, 2015 at 10:08 PM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
>
>> Jared, it was suggested to me that I try the contrast checker add-on for
>> Firefox. I did so and I got some valuable insight there because it
>>showed
>> whether the items were failing on small or large text. Mine are
>>failing on
>> small text which tells me it's the media queries for small devices.
>>
>> Angela French
>>
>> -----Original Message-----
>> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
>> Behalf Of Jared Smith
>> Sent: Wednesday, August 26, 2015 12:47 PM
>> To: WebAIM Discussion List
>> Subject: Re: [WebAIM] Contrast page checker?
>>
>> Angela French wrote:
>> > If I test this url:
>> > http://dev.sbctc.edu/_testing/test-template-errors.aspx
>> > the Summary seems to indicate that I have 16 contrast errors.
>> > But I don't know how to make it show where those contrast issues are.
>>
>> This is a very interesting bug that we've not encountered before.
>> We'll be pushing a fix for this very soon.
>>
>> Thanks,
>>
>> Jared Smith
>> WebAIM.org
>> >> >> at http://webaim.org/discussion/archives
>> >> >> >> >> >>
>
>
>
>--
>Kind Regards,
>Schalk Neethling
>Senior Front-End Engineer
>Mozilla ::-::
>>>>