Re: the case of the pink outline

Sure, it would make a good example.

From: Glenda Sims <glenda.sims@deque.com>
Date: Tuesday, 27 February 2018 at 16:18
To: Alastair Campbell <acampbell@nomensa.com>
Cc: LVTF - low-vision-a11y <public-low-vision-a11y-tf@w3.org>
Subject: Re: the case of the pink outline

Thanks Alastair!  I wanted to make sure that you and I agreed...and it does appear we are both on the same page.

Can we add this specific example to understanding?  Or as a sufficient technique test? or both?

G

glenda sims  |   team a11y lead   |    deque.com<http://deque.com>    |    512.963.3773
*web for everyone. web on everything.* -  w3 goals

[IAAP International Association of Accessibility Professionals: Certified Professional in Accessibility Core Competencies (CPACC)]<http://www.accessibilityassociation.org/certification>



On Tue, Feb 27, 2018 at 3:29 AM, Alastair Campbell <acampbell@nomensa.com<mailto:acampbell@nomensa.com>> wrote:
Hi Glenda,

It looks like this is a case of adding a border that reduces contrast!?

The flexibility is about the graphical object, so you can use either the white arrow, or the purple border.

The main answer to your question is: Use the principle of “delete areas of non-contrast”, if you remove the pink border (e.g. make it white or purple), does that pass?

I.e. select the white arrow and ignore the pink border, so white against purple.

Having “deleted” the pink border, it would still need to make sense as a graphical object, you should still understand it.
For example, if the pink border was a larger area, and made an arrow in the opposite direction (so white pointed right, within a pink arrow that pointed left), you would lose information and it would not pass.

That makes for an interesting test-case… thanks!

-Alastair



From: Glenda Sims

Dear LVTF,

How do we test for contrast on a non-text icon that looks like this:

  *   white (#FFFFFF) arrow with a
  *   pink (#FF5FFF) outline on a
  *   purple (#5B30FF) background
[Inline image 1]

In looking at the 3 colors and contrasting them with each other:

  *   white (#FFFFFF) to purple (#5B30FF)  = 6.3 to 1 color contrast
  *   white (#FFFFFF) to pink    (#FF5FFF)  = 2.5 to 1 color contrast
  *   pink   (#FF5FFF) to purple (#5B30FF)  = 2.5 to 1 color contrast
Do I have to fail this icon for WCAG 2.1 SC 1.4.11 Non-Text Contrast because the pink outline of the arrow does not contrast enough with the purple background?

Or...am I allowed to ignore the pink outline..and compare the white arrow to the purple background and let this arrow icon pass 1.4.11 Non-Text Contrast.

My brain keeps telling me I should let this pass...but I'm not sure how to articulate that it is okay to ignore the pink outline.  Why do I think it is okay to ignore the outline?  Because when I squint, I can almost make the pink outline disappear.  But how would I explain to a tester...that it is okay to ignore the outline???

G


glenda sims  |   team a11y lead   |    deque.com<http://deque.com>    |    512.963.3773<tel:(512)%20963-3773>
*web for everyone. web on everything.* -  w3 goals

[IAAP International Association of Accessibility Professionals: Certified Professional in Accessibility Core Competencies (CPACC)]