E-mail List Archives

Search E-mail List Archives for

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

From: Alan Zaitchik
Date: Mon, Jan 04 2016 10:11AM
Subject: Chrome color contrast analyzer Pixel radius
No previous message | Next message →

Anyone know the answer to this one?
Using the Google Chrome color contrast test there is an option to set the "pixel radius" to 1, 2, or 3.
Anyone know which value to use under which circumstances? I have pages that fail with radius 1 but pass with radius 2.
Is this bad or not?
A

From: Cliff Tyllick
Date: Mon, Jan 04 2016 12:18PM
Subject: Re: Chrome color contrast analyzer Pixel radius
← Previous message | Next message →

I don't know, but I am curious to know more about this concept.

I have known designers to try to make contrast adequate by adding a 1-pixel-wide high-contrast color between foreground and background. I doubt that actually helps. I've been told it actually hinders every sighted person from perceiving the border quickly and correctly. But your results don't seem consistent with a test of this approach. In this case, the value for 1 pixel radius would be higher.

On the other hand, we have dithering, which uses intermediate colors to smooth the appearance of an edge that otherwise would seem to be pixelated. It seems like this would give rise to the results you obtained. If so, I would hope that the answer is that the contrast is adequate.

But, yeah, I'd like to know more about this algorithm in particular and these aspects of adjusting contrast and improving legibility in general.

Cliff Tyllick

Sent from my iPhone
Although its spellcheck often saves me, all goofs in sent messages are its fault.

> On Jan 4, 2016, at 11:11 AM, Alan Zaitchik < = EMAIL ADDRESS REMOVED = > wrote:
>
> Anyone know the answer to this one?
> Using the Google Chrome color contrast test there is an option to set the "pixel radius" to 1, 2, or 3.
> Anyone know which value to use under which circumstances? I have pages that fail with radius 1 but pass with radius 2.
> Is this bad or not?
> A
>
> > > >

From: Kevin Prince
Date: Sun, Jan 10 2016 4:22AM
Subject: Re: Chrome color contrast analyzer Pixel radius
← Previous message | Next message →

If you have a block colour then pixel radius 1 is as good as any other however text is often presented in a smoothed manner by shading the absolute colour with lighter ones. This makes it both appear less blocky but also less intense. If you use 2 or 3 radius you'll get an average value which will be closer to the effective contrast between foreground and background.

Here's a pic I prepared for explaining just this scenario. It's showing a spot colour of 83,83,83 but if you move the block just 1 pixel to the left you are still in the letter form but the average value will be less and the overall contrast reduced.


Access1in5
0212220638
039290692
Independent Accessibility and IT Consultancy.



> On 5/01/2016, at 06:11, Alan Zaitchik < = EMAIL ADDRESS REMOVED = > wrote:
>
> Anyone know the answer to this one?
> Using the Google Chrome color contrast test there is an option to set the "pixel radius" to 1, 2, or 3.
> Anyone know which value to use under which circumstances? I have pages that fail with radius 1 but pass with radius 2.
> Is this bad or not?
> A
>
> > > >

From: Kelly Lupo
Date: Sun, Jan 10 2016 11:38AM
Subject: Re: Chrome color contrast analyzer Pixel radius
← Previous message | Next message →

I don't think the pictures came through... :(

Kelly

On Sun, Jan 10, 2016 at 6:22 AM, Kevin Prince < = EMAIL ADDRESS REMOVED = >
wrote:

> If you have a block colour then pixel radius 1 is as good as any other
> however text is often presented in a smoothed manner by shading the
> absolute colour with lighter ones. This makes it both appear less blocky
> but also less intense. If you use 2 or 3 radius you'll get an average value
> which will be closer to the effective contrast between foreground and
> background.
>
> Here's a pic I prepared for explaining just this scenario. It's showing a
> spot colour of 83,83,83 but if you move the block just 1 pixel to the left
> you are still in the letter form but the average value will be less and the
> overall contrast reduced.
>
>
> Access1in5
> 0212220638
> 039290692
> Independent Accessibility and IT Consultancy.
>
>
>
> > On 5/01/2016, at 06:11, Alan Zaitchik < = EMAIL ADDRESS REMOVED = > wrote:
> >
> > Anyone know the answer to this one?
> > Using the Google Chrome color contrast test there is an option to set
> the "pixel radius" to 1, 2, or 3.
> > Anyone know which value to use under which circumstances? I have pages
> that fail with radius 1 but pass with radius 2.
> > Is this bad or not?
> > A
> >
> > > > > > > > >
> > > > >

From: Chaals McCathie Nevile
Date: Mon, Jan 11 2016 3:33AM
Subject: Re: Chrome color contrast analyzer Pixel radius
← Previous message | Next message →

So here is a description:

if you put some bold black text on a white background, and select a pixel,
it might be mostly surrounded by black, with some dark-grey pixels added
to curves.

This means the algorithm might see several black pixels nest to dark grey,
and point out that this isn't enough contrast.

But if you look at the average around a set of pixels, e.g. in a
several-pixel radius, the black and dark-grey combined *do* give adequate
contrast to the white, even with the odd light-grey pixel that is
similarly added to make things look smoother.

And regarding the algorithm itself:

A bit of this depends on precisely how they select the pixels to check,
and what the checking algorithm is. If you just move from the selected
pixel until you meet pixels of a different colour, without calculating how
they *look*, you might include the dark grey in the background. That would
lead you to conclude there isn't enough contrast.

Instead, it should be included in calculating the average foreground
colour. Likewise, the light grey should be included in calculating the
average background colour, rather than being used on its own. Having more
pixels included makes the average better in general, except if two letters
are very close together, or you check *too many* pixels, it breaks down.

For example, where there is only one white pixel between the top
right-hand point of an "r" and the top left-hand point of an "n" in a font
that makes the strokes several pixels wide, it will be hard for people to
pick the difference between "rn" and "m". On the other hand, if you select
too many pixels from the middle of an "m", you might calculate that most
are black, because you included the side strokes as part of the background
colur.

If you get a graphics program, but some text in using a large bold font,
and then zoom to see individual pixels you'll normally see the way
different colours are used to make it seem smoother.

cheers

On Sun, 10 Jan 2016 19:38:20 +0100, Kelly Lupo < = EMAIL ADDRESS REMOVED = >
wrote:

> I don't think the pictures came through... :(
>
> Kelly
>
> On Sun, Jan 10, 2016 at 6:22 AM, Kevin Prince < = EMAIL ADDRESS REMOVED = >
> wrote:
>
>> If you have a block colour then pixel radius 1 is as good as any other
>> however text is often presented in a smoothed manner by shading the
>> absolute colour with lighter ones. This makes it both appear less blocky
>> but also less intense. If you use 2 or 3 radius you'll get an average
>> value
>> which will be closer to the effective contrast between foreground and
>> background.
>>
>> Here's a pic I prepared for explaining just this scenario. It's showing
>> a
>> spot colour of 83,83,83 but if you move the block just 1 pixel to the
>> left
>> you are still in the letter form but the average value will be less and
>> the
>> overall contrast reduced.
>>
>>
>> Access1in5
>> 0212220638
>> 039290692
>> Independent Accessibility and IT Consultancy.
>>
>>
>>
>> > On 5/01/2016, at 06:11, Alan Zaitchik < = EMAIL ADDRESS REMOVED = > wrote:
>> >
>> > Anyone know the answer to this one?
>> > Using the Google Chrome color contrast test there is an option to set
>> the "pixel radius" to 1, 2, or 3.
>> > Anyone know which value to use under which circumstances? I have pages
>> that fail with radius 1 but pass with radius 2.
>> > Is this bad or not?
>> > A
>> >
>> > >> > >> > >> > >>
>> >> >> >> >>
> > > > --
Charles McCathie Nevile - web standards - CTO Office, Yandex
= EMAIL ADDRESS REMOVED = - - - Find more at http://yandex.com

From: Kelly Lupo
Date: Mon, Jan 11 2016 6:28PM
Subject: Re: Chrome color contrast analyzer Pixel radius
← Previous message | No next message

Thank you!

Kelly

On Mon, Jan 11, 2016 at 5:33 AM, Chaals McCathie Nevile <
= EMAIL ADDRESS REMOVED = > wrote:

> So here is a description:
>
> if you put some bold black text on a white background, and select a pixel,
> it might be mostly surrounded by black, with some dark-grey pixels added to
> curves.
>
> This means the algorithm might see several black pixels nest to dark grey,
> and point out that this isn't enough contrast.
>
> But if you look at the average around a set of pixels, e.g. in a
> several-pixel radius, the black and dark-grey combined *do* give adequate
> contrast to the white, even with the odd light-grey pixel that is similarly
> added to make things look smoother.
>
> And regarding the algorithm itself:
>
> A bit of this depends on precisely how they select the pixels to check,
> and what the checking algorithm is. If you just move from the selected
> pixel until you meet pixels of a different colour, without calculating how
> they *look*, you might include the dark grey in the background. That would
> lead you to conclude there isn't enough contrast.
>
> Instead, it should be included in calculating the average foreground
> colour. Likewise, the light grey should be included in calculating the
> average background colour, rather than being used on its own. Having more
> pixels included makes the average better in general, except if two letters
> are very close together, or you check *too many* pixels, it breaks down.
>
> For example, where there is only one white pixel between the top
> right-hand point of an "r" and the top left-hand point of an "n" in a font
> that makes the strokes several pixels wide, it will be hard for people to
> pick the difference between "rn" and "m". On the other hand, if you select
> too many pixels from the middle of an "m", you might calculate that most
> are black, because you included the side strokes as part of the background
> colur.
>
> If you get a graphics program, but some text in using a large bold font,
> and then zoom to see individual pixels you'll normally see the way
> different colours are used to make it seem smoother.
>
> cheers
>
>
> On Sun, 10 Jan 2016 19:38:20 +0100, Kelly Lupo < = EMAIL ADDRESS REMOVED = >
> wrote:
>
> I don't think the pictures came through... :(
>>
>> Kelly
>>
>> On Sun, Jan 10, 2016 at 6:22 AM, Kevin Prince < = EMAIL ADDRESS REMOVED = >
>> wrote:
>>
>> If you have a block colour then pixel radius 1 is as good as any other
>>> however text is often presented in a smoothed manner by shading the
>>> absolute colour with lighter ones. This makes it both appear less blocky
>>> but also less intense. If you use 2 or 3 radius you'll get an average
>>> value
>>> which will be closer to the effective contrast between foreground and
>>> background.
>>>
>>> Here's a pic I prepared for explaining just this scenario. It's showing a
>>> spot colour of 83,83,83 but if you move the block just 1 pixel to the
>>> left
>>> you are still in the letter form but the average value will be less and
>>> the
>>> overall contrast reduced.
>>>
>>>
>>> Access1in5
>>> 0212220638
>>> 039290692
>>> Independent Accessibility and IT Consultancy.
>>>
>>>
>>>
>>> > On 5/01/2016, at 06:11, Alan Zaitchik < = EMAIL ADDRESS REMOVED = > wrote:
>>> >
>>> > Anyone know the answer to this one?
>>> > Using the Google Chrome color contrast test there is an option to set
>>> the "pixel radius" to 1, 2, or 3.
>>> > Anyone know which value to use under which circumstances? I have pages
>>> that fail with radius 1 but pass with radius 2.
>>> > Is this bad or not?
>>> > A
>>> >
>>> > >>> > >>> > >>> > >>>
>>> >>> >>> >>> >>>
>>> >> >> >> >>
>
>
> --
> Charles McCathie Nevile - web standards - CTO Office, Yandex
> = EMAIL ADDRESS REMOVED = - - - Find more at http://yandex.com
>
> > > > >