WHATWG
2022-04-22
plaintext logs
prev next
source on github
00:58
<Seirdy>

Bit confused about aria-labelledby versus aria-describedby wrt <figure> and <figcaption>. reading MDN, it says that aria-describedby is for long captions and aria-labelledby is for short captions, but we should use <figure> and <figcaption> instead. If the figure caption is a wee bit long (say, >150 characters), does it switch from being a label to a description? Firefox's accessibility tree doesn't seem to indicate so, and neither did the HTML Living Standard when I checked.
Some of my captions start with something like "Code Snippet 4 (shell): ...", and then comes a longer description. I'd ideally want to make everything before the colon the "label" and the full caption the description (or maybe just everything after the colon?).
I hope I'm not being too "clever" by breaking the first rule of ARIA, but it seems like plain HTML really doesn't handle the distinction between labels and descriptions when using "figure" elements.

14:57
<Domenic>
Seirdy: have you tried testing with a screen reader? I'm not sure screen reader users actually benefit from having both label (thing before the :) and description (thing after the :). Just a longer description would work better for them IIRC.
15:47
<Seirdy>
Seirdy: have you tried testing with a screen reader? I'm not sure screen reader users actually benefit from having both label (thing before the :) and description (thing after the :). Just a longer description would work better for them IIRC.
Good point. Though I should try testing with different verbosity levels too...
15:57
<Seirdy>
yeah it looks like Orca does understand the difference but doesn't read the description by default when the label is provided.
15:58
<Seirdy>
hang on, i think there's more. gimme a sec...
16:02
<Seirdy>
ok i got it:
16:02
<Seirdy>
orca understands "everything before the colon" is the aria-label and reads it first.
16:03
<Seirdy>
then orca reads the entire figcaption.
16:03
<Seirdy>
(including everything before the colon)
16:03
<Seirdy>
so there's some repetition.
16:04
<Seirdy>
Now, I have like 20 code snippets on this page so I want people to be able to quickly identify them using a short label rather than the full caption. So I don't wanna give up on the concept of a label shorter than the "full description".
16:04
<Seirdy>
semantically I think the right thing to do would be to make "everything before the colon" a heading.
16:06
<Seirdy>
visually i might have to mess with CSS a bit to make that "look right" and not look like a new subsection of the article (i.e. look like a figure).
16:07
<Seirdy>
ideally "everything before the colon" would not get is own newline, so i could just break the first rule of ARIA and give the pre-colon text a role="heading" 😈
16:24
<Seirdy>
huh apparently if you navigate to a figure landmark, orca will read the label (which is the caption) and then enter the figure and includi including the caption. the caption gets read twice. making "before the colon" the aria-label has improved this.
16:24
<Seirdy>
idk why i didn't think to actually follow SR behavior before, i got too caught up in theory. Thanks for the reality check Domenic! Seirdy out, for now.
17:19
<smaug>
Domenic: I guess in my mind NavigationTransition or some such would be the object which the event had a pointer to and once event dispatch was done, Navigation.transition would point to that (if navigation would proceed). So effectively this object which tells about transition would be created before, not after, the event dispatch and event dispatching is used to tell how the transition should work by modifying that object.
17:20
<Domenic>
Hmm, well, the idea behind the name transition was that it only exists if you call transitionWhile().
17:49
<smaug>
But it is an object created for navigation and whether or not Navigation.transition ends up pointing to it is a separate thing.