Open WilcoFiers opened 10 months ago
gregg
Gregg Vanderheiden @.***
On Sep 6, 2023, at 4:10 AM, Wilco Fiers @.***> wrote:
Previous issues: w3c/silver#260 https://github.com/w3c/silver/issues/260, w3c/silver#329 https://github.com/w3c/silver/issues/329, w3c/silver#330 https://github.com/w3c/silver/issues/330 Previous work: https://www.w3.org/WAI/GL/WCAG3/2020/outcomes/uses-visually-distinct-headings
Open questions
How should it be decided whether headings are sufficiently distinct, from each other and from other content? Can this be done using color contrast? Should the distance from which a heading can be read be factored into this?
Do we have a requirement for this? This seems to go beyond accessibility. If they are not distinct for anyone — then is it an accessibility question?
Be sure to differentiate between "font" and "typeface". Helvetica 12pt bold is a different font from Helvetica italic 14px, but has the same typeface.
As long as things are programmatically different
Ensuring sufficient semantics on headings may be more impactful or important than ensuring headings are visually distinct. Maybe the requirement for visual presentation could be focused on changing presentation away from the default.
What do you mean by "sufficient semantics" I translate this as "sufficient meaning" but not sure that is an accessibility issue. We can’t require that authors that make meanless headers rewrite them to be meaningful… (I don’t think)
Did you mean something different?
— Reply to this email directly, view it on GitHub https://github.com/w3c/wcag3/issues/19, or unsubscribe https://github.com/notifications/unsubscribe-auth/ACNGDXS2NJTWM3CQH3O5MSDXZBK3TANCNFSM6AAAAAA4NE7VOQ. You are receiving this because you are subscribed to this thread.
Content structure for a good visual hierarchy is definately an accessiblity issue (coga, among others). It is also a contrast issue. White space between lines and letters affects contrast perception, as does font weight.
The primary driver of contrast is the spatial characteristics. The amount of padding around text blocks, or around a heading, plays a part. It is mainly critical for blocks of body text.
In the image below on the left and the right the stroke wits and want sizes are identical on the left 3:1 on the way to 7:1. Certainly the seven to one is darker but notice that the major change in contrast appearance is related to the weight or thickness of the line. And the balance of line thickness is white space.
Also, in the contrast thread #10, there's a post that lists the SCs that belong with lightness contrast, and the SCs that go together with use of color.
Useful to remember that color as in hue/saturation is processed in the human vision system separately from lightness/darkness (luminance). And all find detail is in that luminance which is why luminance is critical for reading.
Therefore it is sensible to group the SCs that are about hue/sat, separate from those about luminance.
- How should it be decided whether headings are sufficiently distinct, from each other and from other content? Can this be done using color contrast? Should the distance from which a heading can be read be factored into this?
I think we need to look into what methods are currently being used which are sufficiently distinct so that we don't accidentally remove one. It's also important to consider combinations of different distinctions.
Some distinctions I encounter or think about often:
Hi @u9000-Nine
Some dictions I encounter or think about often:
Yes, good. I think these divide into three categories.
Hi @u9000-Nine
Hi @Myndex 🙂
Some distinctions I encounter or think about often:
Yes, good. I think these divide into three categories.
- Color/lightness contrast
- Spatial style/whitespace (directly affects contrast)
- Non-text indicators (additionally guides visual hierarchy)
I like the idea of breaking these out, but I think it needs slightly more categories than you have. What do you think about the following?
Hi DJ Chase @u9000-Nine Sorry for the delay in response.
Note: my "drinking from a firehose prolixity" is part of my process in working through ideas. I've hidden most of the backwork under "Click for details".
Visual text attributes (better name needed) distinctions
- Font-weight
IMO font Weight is the primary, most critical "spatial quality" because it directly defines the spatial frequency which directly affects contrast sensitivity, which ultimately determines the perception of contrast, and with that, readability.
Click to enlarge:
In the graph above, all the sample text is in the same color, but the different weights indicating the approximate placement on the human contrast sensitivity curve for a practical demonstration of the abstract science.
Most other font attributes are also spatial in nature, at least in part, but not always as critical to that definition.
If we think about this from the user-need perspective, the four related core user needs for text/readability/structure accommodations are:
Taking another stab at this, I'd class weight/stroke width and all whitespace as spatial. For font-size, there are arguments for spatial or font characteristics. Because font-size is (should be) universally adjustable by the user, setting size under font layout makes sense, particularly considering reflow.
For Headings, Body-Blocks, Nav, Main Content (proposed)
I think it's best to group by
For instance, luminance is achromatic (disregards hue) and is processed by the human vision system separately from color (hue/saturation). Luminance (lightness) serves different functions from color (hue/sat) including cognitive, language, object recognition, motion, etc.
Footnotes to "Font - Layout"
¹ Small caps and all caps are only for mixed case (bicameral scripts), and probably fits better under content.
² Writing system and text orientation could fit under font or content, possibly better with content.
³ Text decoration, such as underline, fits best under non-text, which is also probably best for link indication, but other decoration such as text-shadow or outline-text is probably better as part of font characteristics.
Sorry for the delay in response.
No worries @Myndex; we're doing this asynchronously. Thank you for putting such thought into your response!
I'm fine with this. By "spatial" I was talking about layout, but I'm all for changing the names for consistency. I also like the category names you chose -- they're very clear.
I generally agree with your changes. This is, again, very well thought out.
By "font size should always be user-adjustable", do you mean that we shouldn't allow font size as a distinction? I'm perfectly fine with not allowing absolute font size as a distinction, but I think a heading being larger than the body text (however big that is) is valid.
Why is text decoration in both Layout and Nontext?
² Writing system and text orientation could fit under font or content, possibly better with content.
I strongly believe that writing system should be in content (or both). When I write in sitelen pona, for example, I can use different semantics and nuances than I can when writing in Latin or speaking.
I'm perfectly fine with not counting color as a distinction. I noted it because it's something I see often (it's the default in Word), but it does definitely create issues with colorblindness.
Hi DJ Chase @u9000-Nine
Weight...spatial
I'm fine with this. By "spatial" I was talking about layout....
You might find Accessible Contrast Easy Intro interesting. I have tried to find a better plain language term for "spatial", I'm certainly open to thoughts. Yes it is about layout, but also contrast....
Groups
I also like the category names you chose... well thought out.
Thank you, some of this emerges from the contrast research we've been doing, most particularly things like size and weight.
Font size
By "font size ... user-adjustable", do you mean that we shouldn't allow font size as a distinction?.
Oh no not at all, it is an important way to distinguish.
I think a heading being larger than the body text... is valid
Ah, yes yes font size is, and should definitely be, a distinguishing feature.
What I meant was, users adjusting fonts is to be considered, such as to how containers and "overflow" is handled. Ideally users should be able to scale the smallest body text up to around 80px to 92px (by font size), that means an x-height of about 42px. This is a zoom of 450% to 500%.
We want users to be able to zoom up the smallest text by 500%, but text that is already larger should zoom a smaller percentage.
See this experimental page of text zooms, and you'll notice that 500% is non-tenable for a cell phone, so device characteristics need media queries and consideration.
The tech for proportional text zoom is not yet in all browsers, but it is in Android now.
And while users can adjust text size, there are still reasonable size minimums depending on use case.
Relative font size is important for the visual hierarchy, and importantly, increasing font size results in the stroke being thicker, which increases visual (darkness/lightness) contrast.
RELATED: this page of size experiments demonstrates the futility of the CSS font-size metric. Font-size and weight is not absolute and massively varies between families.
Text decoration
Why is text decoration in both Layout and Nontext?
Open to discussion IMO... there are reasons it can be either place.
If it indicates functionality (underlined link) then leaning toward non-text. If it's just divisional, then leaning toward layout.
Writing system Writing system & text orientation could fit under font or content...
I strongly believe that writing system should be in content (or both). When I write in sitelen pona, for example, I can use different semantics...
Sensible, we've been discussing with some typographers in Asia regarding asian writing systems, particularly Japanese as it uses a combination of kana and kanji. So a single-case alphabet, and also logographic symbols, all intermingled. kanji is about twice as detailed and twice the spatial frequency, yet traditionally, they size both to an equal vertical height.
Color
I'm perfectly fine with not counting color as a distinction.....
Color is definitely a useful and important distinguishing element, and if I made it seem otherwise, that was an error.
It's just that color (hue/saturation, and not including luminance or lightness) shouldn't be the only distinguisher, if the color is meaningful. There is massive variation in how people perceive color, even among standard vision. And then context is results in even further unexpected results.
See this image: note in particular the yellow dots and the gray square each one sits on.
Both yellow dots are the exact same CSS color value. And both gray squares the dots are on are also identical to each other. The dot in the shadow looks like it's glowing due to perceptual context, not absolute by any means.
Color PLUS font-weight/size/family is good. It is still important to maintain lightness contrasts for readability.
So use color, YES, but as an accompaniment, not as the solo violinist.
Previous issues: w3c/silver#260, w3c/silver#329, w3c/silver#330
Previous work: https://www.w3.org/WAI/GL/WCAG3/2020/outcomes/uses-visually-distinct-headings
Open questions
How should it be decided whether headings are sufficiently distinct, from each other and from other content? Can this be done using color contrast? Should the distance from which a heading can be read be factored into this?
Be sure to differentiate between "font" and "typeface". Helvetica 12pt bold is a different font from Helvetica italic 14px, but has the same typeface.
Ensuring sufficient semantics on headings may be more impactful or important than ensuring headings are visually distinct. Maybe the requirement for visual presentation could be focused on changing presentation away from the default.