F81 note updated to clarify the meaning of “sufficient difference in luminosity"#4530
F81 note updated to clarify the meaning of “sufficient difference in luminosity"#4530giacomo-petri wants to merge 2 commits intomainfrom
Conversation
✅ Deploy Preview for wcag2 ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Note that this conflicts with the change from #1033. I suspect the edit in this PR could supersede the "A minimum contrast ratio" sentence that was added mid-paragraph, but we probably want to retain the additional sentence that #1033 added at the end? (I can make these changes if there's agreement) |
bruce-usab
left a comment
There was a problem hiding this comment.
@kfranqueiro please check link to G183 in deploy preview for F81. The syntax looks correct to me, but it results in an 404.
Good spot, fixed. The technique being linked from is in a different techniques subfolder so it needs to navigate one level up and into general. |
|
worth pointing out that the whole "3:1 is considered sufficient" had been hoisted up into the actual understanding doc itself https://www.w3.org/WAI/WCAG22/Understanding/use-of-color ... so perhaps better to reference/mention that, rather than trying to cross-link to another technique |
| </ul> | ||
| <div class="note"> | ||
| <p>In both examples, the color could be used without failure if the text was sufficiently different in visual presentation (e.g. bold or in a different font) that it would be easily differentiated from the surrounding text if the color were removed. It would also not fail if the color chosen had sufficient luminosity difference (lightness) from the other text that it would be easily be seen as different if viewed in black and white. In these cases - the information would not be displayed in color (hue) alone but also in "presentation" or "lightness" respectively. </p> | ||
| <p>In both examples, the color could be used without failure if the text was sufficiently different in visual presentation (e.g. bold or in a different font) that it would be easily differentiated from the surrounding text if the color were removed. It would also not fail if the color chosen had sufficient luminosity difference (lightness) from the other text that it would be easily be seen as different if viewed in black and white. Like technique <a href="../general/G183">G183: Using a contrast ratio of 3:1 with surrounding text and providing additional visual cues on focus for links or controls where color alone is used to identify them</a>, a sufficient luminosity difference would be a contrast ratio of 3:1. In these cases - the information would not be displayed in color (hue) alone but also in "presentation" or "lightness" respectively. </p> |
There was a problem hiding this comment.
https://www.w3.org/WAI/WCAG22/Understanding/use-of-color already has the note that explains this, so no need to point to G183
Note
If content is conveyed through the use of colors that differ not only in their hue, but that also have a significant difference in lightness, then this counts as an additional visual distinction, as long as the difference in relative luminance between the colors leads to a contrast ratio of 3:1 or greater. For example, a light green and a dark red differ both by color (hue) and by lightness, so they would pass if the contrast ratio is at least 3:1. Similarly, if content is distinguished by inverting an element's foreground and background colors, this would pass (again, assuming that the foreground and background colors have a sufficient contrast).
There was a problem hiding this comment.
Given it is in the Understanding document note now, I'm inclined to conclude it is already covered, and this PR can be closed as unnecessary. Note too that #873, which this is intended to address, was already closed by a change last month.
|
@mbgower to close with comment |
|
@giacomo-petri Given it is in the Understanding document note now, we conclude it is already covered, and this PR can be closed as unnecessary. Note too that #873, which this is intended to address, was already closed by a change last month. If you feel we're missing something, please reopen. |
Closes: #873
Updated note for clarity; in line with technique G183, a sufficient difference in luminosity is defined as a contrast ratio of at least 3:1.
Preview diff of F81: Failure of Success Criterion 1.4.1 due to identifying required or error fields using color differences only