Add clarification to 1.4.11 Non-text contrast understanding about logos acting as user interface components - UIC "inherits" the exemption for logos with insufficient contrast

[patrickhlauke]

The counter-proposal #5249 has been closed - see #5249 (comment)

This is a redo of the previous speculative PRs - cleaned up, and expanded to not only include "logos" but more generally any graphical objects that are exempted, like flags and such

Supersedes #5133 (which only focused on logos, but the same rationale needs to apply to any other graphical objects - like flags etc - whose contrast/colours can't be changed, but that also act as UICs)

In addition, this PR moves the "Logos" section directly under/into the "Exception examples", where it more logically belongs, fixes some markup indentation, and lowercases some of the headings.

Copying over the context/rationale from #5133

The normative wording for 1.4.11 https://www.w3.org/TR/WCAG22/#non-text-contrast

The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s):

User Interface Components
Visual information required to identify user interface components and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author;
Graphical Objects
Parts of graphics required to understand the content, except when a particular presentation of graphics is essential to the information being conveyed.

has two distinct aspects/subjects - user interface components (UICs) and graphical objects.

Logos that have insufficient non-text contrast are exempted when they act as graphical objects, as their (low contrast) colours fall under the "except when a particular presentation of graphics is essential" clause.

However, when logos are the only content inside a UIC, the logo itself may be exempt, but the UIC around it has no explicit exemption. A button/control only containing a logo with insufficient contrast, and no other sufficiently contrasting visual indicator, normatively doesn't appear to be exempt.

This PR handwaves this and says that the exemption for the logo carries over/is inherited by the UIC

---

Closes #4376, closes #1275, closes #1739

x-ref #902

Preview: https://deploy-preview-5250--wcag2.netlify.app/understanding/non-text-contrast

Diff: https://services.w3.org/htmldiff?doc1=https%3A%2F%2Fwww.w3.org%2FWAI%2FWCAG22%2FUnderstanding%2Fnon-text-contrast.html&doc2=https%3A%2F%2Fdeploy-preview-5250--wcag2.netlify.app%2Funderstanding%2Fnon-text-contrast

[netlify]

✅ Deploy Preview for wcag2 ready!

Name	Link
🔨 Latest commit	c33a064
🔍 Latest deploy log	https://app.netlify.com/projects/wcag2/deploys/6a8c6a0e638a7d00088ef9c4
😎 Deploy Preview	https://deploy-preview-5250--wcag2.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[patrickhlauke]

While originally this handwave seems not to follow from the normative wording, as written, it does deftly circumvent the problems of #5249 (comment) - but fundamentally, this would be a change in understanding that effectively changes/contradicts the normative wording of the SC. if we do go for this one, suggest that for a potential WCAG 2.3 we actually address the problem in the normative wording of the SC

[patrickhlauke]

A further aspect I'd like to address (both here and in the other PR) is the weird heading structure of the current understanding document...

[bruce-usab]

Preview Diff between 5249 and 5250 at Essential Exception.

[bruce-usab]

I prefer 5250 over 5249.

[patrickhlauke]

This PR now also fixes the confusing heading structure/order we had (with all the UIC examples in the "Intent" section, and the actual "Examples" section only containing the graphical object examples).

Before: https://validator.w3.org/nu/?showoutline=yes&doc=https%3A%2F%2Fwww.w3.org%2FWAI%2FWCAG22%2FUnderstanding%2Fnon-text-contrast.html#headingoutline

After: https://validator.w3.org/nu/?doc=https%3A%2F%2Fdeploy-preview-5250--wcag2.netlify.app%2Funderstanding%2Fnon-text-contrast&showoutline=yes#headingoutline

[bruce-usab]

The use of sentence case (as compared to title case) in headings does not seem 100% consistent to me. But maybe more words are meant as proper nouns than I think?