Discussion points for Deep Dive on Trees

[carmacleod]

The next Deep Dive on Trees will be on Thurs Sept 3.

• Active, Activate: Relationship between Enter, Space, single-click, double-click, Windows, Mac
  • concept of "active" treeitem: the one whose content is "currently showing" in a corresponding/controlled viewer/editor panel/dialog, etc
  • aria-current="something"?
• Relationship between aria-selected, aria-checked, "active" treeitems in single-select and multi-select trees
• Mac/VO role=tree conveys the APG tree example as a table, with "list boxes" for treeitems. Is it using AXTable instead of AXOutline? (IIRC, this an artifact of AppKit trees being implemented as single column tables. Could file as a VO enhancement request. – jc). (ok, opened webkit 215698 - car)

Questions:

1. Spec for treeitem says aria-selected is required, spec for aria-selected says something like, "not required in single-select trees where selection follows focus because the user agent can figure that out". This is discussed in Clarify if aria-selected & aria-checked are required on roles 'treeitem' & ('menuitemcheckbox', 'menuitemradio') respectively #798 and Should aria-selected be listed as required for option role?  #700. Not sure if requiring aria-selected is somehow the reason that NVDA verbosely says "not selected" for every treeitem with aria-selected="false", and does not say "selected" for treeitems with aria-selected="true". Seems like a backwards choice (except for the one case where selection follows focus in a single-select tree... but I guess that's the most common case). JAWS doesn't announce selected (or not selected) at all when arrowing through treeitems - is this a JAWS bug?

Note there are 3 use cases: 1) single-select where selection follows focus, 2) single-select where selection does not follow focus (common where a tree controls a panel), and 3) multi-select.

2. Multi-select tree with "active" treeitem showing in corresponding panel - can't denote "active item" with aria-selected because there can be many selected items, can't use focused item because that needs to move independent of selection and active item. Would screen reader users want to know which item was showing in the related side panel?

Note: using aria-current to convey active item would be appropriate per definition of aria-current.

2. a. Just to confirm, if we have an "active" tree item (i.e. with aria-current="true"), should we be using aria-controls to point from the tree to the "active" region (i.e. side panel)?

3. Space key. APG guidance separates unmodified Space key and Enter key, using Enter to "activate" a node (i.e. perform its default behavior), and Space to aid in selection in a multi-select tree. But Space is typically used for "activation" on Mac (see Change contain to own in Required Owned Elements and Required Context Role #1438), so if a tree wants to use both Space and Enter for the default action, what would the keyboard guidance be for multiple selection? Same as the "Alternative selection model", where modifiers are always required to retain the current selection? Note that Cmd+Space is spotlight.

4. Checkboxes. After discussing aria-checked on option and treeitem #1052, we ended up saying, "it's ok to use aria-selected OR aria-checked on treeitems, but not both in the same tree", because dual-state "selected, not checked" and "not selected, checked" are hard to understand. Also, you'd need to have separate behavior for the space and enter key (one to select, one to check/uncheck), which would break users. However, there may be use cases that want to use both, such as batch operations (select a bunch of items and then delete, rename, check, etc). Perhaps the best way to do this is to allow real checkboxes in treeitems?

Note: putting a checkbox inside a tree item would not solve this. It would end up being equal to a checked tree item. Visually, it can look like a checkbox inside or adjacent, but from ARIA perspective, a checked tree item and a tree item containing a checked checkbox would end up with the same UX.

5. Disabled treeitems with aria-disabled. Not sure how disabled tree treeitems would be discovered, other than going into reading/browse mode. There's something weird about browse mode in a tree, though. I tried typing escape while part-way through the APG tree example with NVDA, and it seemed to get "stuck" - down arrow only through one branch of the tree and then refuses to keep reading.

Note: JAWS and NVDA do not render a full tree in reading mode. This is by design; same is true with listboxes.

6. The APG example expands/collapses nodes when the user clicks on either the "twistie triangle" or the parent node's text. However, in a multi-select tree where the design wants expandable (parent) nodes to be selectable, we don't want selection to happen when the mouse clicks on the text, because the user may just want to expand/collapse without losing their selection.
   Similarly, the user may just want to select a node by clicking its text, without expanding/collapsing.
   So is it ok to decouple selection from expand/collapse when using the mouse? It is already decoupled when using the keyboard, because right/left arrow expands/collapses, and "something else" selects (i.e. maybe up/down arrow, or maybe space, maybe combined with modifier keys, etc). Assuming this is ok, we would make sure that the little expand/collapse twistie triangle is at least 44 x 44 px (to pass WCAG and ensure it's large enough for users to click/tap easily).

   In a single-select tree, I've often seen double-click on the node's text which selects and expand/collapses. In those cases, single-click only selects (i.e. select and expand/collapse are partially decoupled). Would we typically recommend that on single-select trees, to give a larger click area?

[pkra]

Are non-interactive trees in scope for the deep dive? (I have had good success with ARIA tree markup for tree-like diagrammatic content.)

[carmacleod]

Are non-interactive trees in scope for the deep dive? (I have had good success with ARIA tree markup for tree-like diagrammatic content.)

That's good to know, but I think I'd like to keep the scope of this to interactive trees for now. Thanks!

[pkra]

I think I'd like to keep the scope of this to interactive trees for now.

Thanks for clarifying, @carmacleod!

[cookiecrook]

I edited the original to add a minor note to the Mac tree vs table comment.

[carmacleod]

For a more concrete idea of where these questions are coming from, here are the relevant links for the experimental Carbon TreeView:

• Design exploration/discussion
• Documentation
  • Note: not yet complete: sections on keyboard, mouse, screen reader behavior, and accessibility are pending
• Single-select TreeView working example
  • works ok with NVDA/JAWS in Chrome/FF - still need to test other pairings
  • tested with VO in Safari/Chrome - works oddly (webkit 215698)
• Multi-select TreeView example (see Caveat)
  • Caveat emptor: full multi-select behavior is not yet implemented. Currently, multiple selection is only possible with either Ctrl/Cmd+click for mouse, or Ctrl/Cmd+Space or Ctrl/Cmd+Enter for keyboard. Arrow keys move focus but do not deselect. This is incomplete and non-standard, and will be reviewed with standard multi-select keyboard keystrokes in mind.

[mcking65]

Added following notes in the top comment:

After question1:
Note there are 3 use cases: 1) single-select where selection follows focus, 2) single-select where selection does not follow focus (common where a tree controls a panel), and 3) multi-select.

After question 2:
Note: using aria-current to convey active item would be appropriate per definition of aria-current.

After question 4:
Note: putting a checkbox inside a tree item would not solve this. It would end up being equal to a checked tree item. Visually, it can look like a checkbox inside or adjacent, but from ARIA perspective, a checked tree item and a tree item containing a checked checkbox would end up with the same UX.

After question 5:
Note: JAWS and NVDA do not render a full tree in reading mode. This is by design; same is true with listboxes.

[majornista]

Another important consideration is how to distinguish between item selection, performing the default action or expanding a tree item using a mobile screen reader. For this to work, it seems that the treeitem element should support interactive children, like a checkbox or toggle buuton in addition to a group of descendant treeitem elements.

[carmacleod]

Take-aways from first Deep Dive on Trees (Aug 20)

Question 2 ("active" item and aria-current):

General consensus was that yes, it is valid to decouple "active" tree item from "selection" from "focus", and yes, it would be useful to know which node is currently active when navigating through the tree, and aria-current = "true" is a good, semantic way to denote the "active" node.

Example is an email program. The user can have the Inbox folder "active" (i.e. showing in the panel on the right), and multiple folders "selected" (i.e. in order to do some multi-select action on them, like maybe move them into another folder), and they can still move the focus down to yet another folder (i.e. maybe intending to add that to the selection or something).

New question (also added to opening comment):
2a. Just to confirm, if we have an "active" tree item (i.e. with aria-current="true"), should we be using aria-controls to point from the tree to the "active" region (i.e. side panel)?

Question 3 (space/enter on Windows/Mac) together with question 4 (checkboxes)

Note: Transcript for this part of the call is in the disclosure at the end of this comment.

Here are what I believe are the consensus points:

• follow platform conventions for space and enter

  • don't make space and enter do the same thing on one platform
    • [Edit: actually, there was no consensus on this. Many think that since space and enter are often conflated, they should have the same effect, to reduce confusion]
  • Windows and Linux typically use enter for "activation", and Mac typically uses unmodified space for "activation"
  • note that on Mac:
    • Command-Space is not available (it is used for Spotlight search)
    • Control-click is not available (it is the same as "right click", which usually opens a context menu)
    • Control-down and Control-up are not available (they are for Mission Control, i.e. for switching desktops)
  • Can select contiguous items on both Mac and Windows with Shift-click (mouse) or Shift-down or Shift-up arrows (keyboard)
  • Mac does not seem to have a keyboard-only way to select non-contiguous items without using VoiceOver, but maybe that's ok (because Mac users don't expect to be able to do this)

• selected and checked do have different semantics:

  • checked is a stable state, i.e. something that is checked is "permanently checked", until it's "permanently unchecked" by the user. Checked state is used for options, settings, or boolean information being entered into a form.
  • selection is ephemeral, temporary. It is used to denote the set of items that will participate in some action or invocation. After the action (or set of actions) is completed, the user has no more need for that selection, and they typically either make a new selection or move on to some other control.

• as such, it is "ok" (i.e. not forbidden) to use both aria-selected and aria-checked in the same tree, except that you need to consider these points:

  • it is really confusing for all users (difficult to understand even when the user knows what is going on; hard to keep it all in mind; large cognitive load)
  • keyboard users need separate keystrokes to select multiple items as well as check them
  • difficult to understand screen reader saying "selected, not checked" or "not selected, checked"
  • it may be understandable in a power user use case, but not for lay users

Other notes:

• if a tree is in a dialog, probably don't want to allow "activation" of tree item, because authors may implement - and users may expect - that typing enter activates a designated "default" button in the dialog.

Transcript of space/enter and checkbox discussion

Matt: pressing Enter would probably make something active, which would be the most natural simple way to go from the tree to the active item.

Sina: In a dialog, Enter will activate the default action, and space will activate that which is focused.

JamesC: [For example, in a tree], spacebar is the default activation key on Mac, like Enter is on Windows. Return on Mac would be for a default button, like in a dialog, but whatever is focused would accept spacebar.

Matt: You can't do non contiguous selection with the keyboard in Finder - correct?

JamesC: With VoiceOver, there's quick toggle commands to decouple the focus from the VoiceOver cursor, and then you can make multiple selections.

Matt: Right, Ctrl+Option+Shift+F3
Anyway, there's a not a keyboard way to do selection on non contiguous item without VoiceOver. So, maybe this is sort of a
moot point, this is just a scenario that isn't supported in Mac, whereas in Windows, we have the option to use space for selection. So you don't have to hold down a modifier. So Windows even has this built into Windows Explorer, you can navigate around. There's two ways to do it. One is you hold a modifier down (control) and you navigate and then you press space on the things you want to select, but my preferred way, which is so much less stressful, is that you can just go around and hit the space and check anything you want to. And then when you're all done, you can perform your operation.

I actually don't see how that wouldn't necessarily be a problem, Carolyn, in a tree. If you support multiple selection and each tree item sounds to the voiceover user like a checkbox, because after you press space, the activation is "checking" and that is activation. And then if you have a separate keyboard command for making an item active, that would be fine.

JamesC: We've crossed terms there, from selected to checked.

Sina: In the checkbox scenario, imagine that you have a list or tree view with items and then you hold Shift and go down, down, down, you've selected them. You have not checked.

Matt: this question that you're asking about the keyboard, Carolyn, is directly tied to the other question that you have about selection and checked. And we had a discussion where it's like, okay, maybe it's okay to decouple selection and checked. But I think that was because that discussion did not involve aria-current. And so if we were to re litigate that discussion today, but throw aria-current into the picture, I think it would be reasonable to say that you should not do both selection and checking in the same tree at the same time.

Sina: But then how can you [select multiple] how can you check multiple items?

Matt: I think that in a multi-select tree, it kinda doesn't matter whether you represent selected or checked - it could be either one.

Sina: One is ephemeral, though.

Mike G: From a visual perspective, it makes a lot of difference, and from a keyboard interaction perspective, it makes a huge difference, too, because a checkbox retains the checked state regardless of the selection. So you don't need to hold down multiple modifier keys to do contiguous and non-contiguous selections.

Matt: Windows Explorer made it so you can use checkboxes for selection (it's an option), and so basically, checking means selected.

Sina: It does in Explorer, because selection and checked mean the same thing in Explorer, but I just want to point out that if you imagine those being options, or something else (not files) whose selection is their participation in the set of invocation, but instead is simply a stable state that you are toggling then selection and checks and do need to be decoupled from one another.
Unless you're ok with saying it's multi select and it's too confusing and I'm only going to let you select one thing at a time. You can select as many as you want, but just one thing per user action. But I just don't see the reason for that limitation.

Matt: It sounds like you're talking about a tree where you could have up to four states per item: active, selected, checked, and focused.

Sina: 100% yes

Matt: That's nuts!

Sina: Like it's not made up though. It's true.

Matt: In real life, I say choose three of them.

Mike G: If you made it part of the spec that once you do multi select, you must use checkboxes for that implementation, then you kind of solve that.

Matt: That's what I was suggesting. Exactly, Michael.

JamesC: I don't even remember what Carolyn's question was, can we get back to that?

Carolyn: It was about space key, and we segued into checkboxes. But that's the very next question, so I thought we could kind of blend them together. In the APG, there are two possible selection models for multi select trees. The first one, the recommended one, uses unmodified space to select. If we go with "unmodified space activates", then we can't use the recommended selection model. So the alternative selection model comes up, and it has control-space which on Mac command-space is spotlight. You don't want to override that. So what is the recommendation here, if we want space and enter to both be default action (or activate or whatever you want to call it), then what is the alternative selection model that we would need to use, keeping Mac in mind.

Sina: Do we want them to be the same?

JamesC: So, to clarify, control+space - is that a standard in Windows?

Carolyn: Yes, for discontiguous selection. You would control arrow down, and that would keep your selection, and then you would hit Control space to add the focused item to your selection.

Matt: That's so stressful, by the way.

Sina: And it's not needed. If you just make them checkboxes, that goes away.

Matt: Yeah, exactly. So, Sina, were you asking - I mean, I think this is a really critical question - in a multi-select tree, do we really want to put the constraint that enter and space have to do the exact same thing?

Sina: I don't like that constraint whatsoever.

Matt: I don't like it either. I think it's a waste.

Sarah: I've actually tested this, months ago, when we were first talking about checked and selected. I made a list box that had both checked and selected that were separately toggled with enter and space and meant different things.
And I ran it by several co workers who are blind and use screen readers, and I ran it by also several other co workers who just used the visual UI and, like, particularly my co workers who use screen readers, just didn't know what was going on, why checked and selected were different, and what they meant. And even talking it through, it was difficult to hold in mind and understand. Just the idea that enter and space would each be tied to one of those states. Overall it just seemed super unusable, and a really high cognitive load.
Even visually unless there are literally separate UI controls like a checkbox that is separate from the list item, it's hard to understand visually and interact with, with a pointer as well.
The result of this is that I don't think there's an understandable way to make this work with a keyboard, if you're sighted or with a screen reader if you're not looking at the UI, making checked and selected mean different things. Just in practice, I think that's that's too much information per item, you need to be able to have elements that mean one thing, each.

Sina: Think it would be an advanced user interfaces, though. Like, it wouldn't be something that would be recommended in the standard, making a multi select list online kind of thing for a cart or something like that. But in a digital...

Matt: I think that's a strong argument for not allowing both selected and checked in the same tree is what you're saying. Right, Sarah, I mean, that's really good. If we have people creating multi select trees, choose one or the other, whether it's selected state or checked state.
I think the point that Sina was making earlier though that having the script, having the constraint that enter and space must do exactly the same thing, that becomes a problem in a multi select if you want one of them to activate the current item and another to select or check.

Bryan: I see the tree scenario in real life in installers and stuff where say you have a tree and it has partially checked items within the rules, and you can select inside nodes. You don't necessarily always have to press space to do that. You could actually tab to something that it will enable something, and then you tab back and it will toggle that checked state appropriately and that's separate from the action of selection. So I just want to say there are scenarios where having all those does not actually reflect.

James C: So like two comments. I wanted to discuss the "just make them checkboxes" comment and also the "space versus enter" comment that's come up a couple of times. So I feel like we're we're butting up against a couple of different - what I think are probably - ARIA design goals.
So the "just make them checkboxes" comment, right, if we say, okay, you have to do selection by making some of this interaction checkboxes. ARIA's goal is not necessarily to define all interaction on the web, it's to take interaction as it is has landed on the web, however that lands, and make it accessible.
And so it's it's a real challenge to tell the designers they can't do that because ARIA says they have to do it this way.
So I agree with all the comments that you know selection and checked and, you know, a tree view that is possible and has all of these different states, active is separate from selection, etc. is super confusing... and typically the market seems to regulate itself pretty well here because confusing UIs don't stick around for very long - they get redesigned, or the app that doesn't redesign itself to stops getting used.
So I don't know that we should take the scenario where we say all trees if they want to have selection should absolutely have to expose things like hidden checkboxes to a voiceover user, or visible checkboxes to a sighted user, because I just don't think that's going to fly, the way web applications work. The other comment that I heard was, I think Matt said, I don't think we should be limited to making space and enter do the same thing. Is that right?

Sina: Yes, that's right. He just left, but that is definitely what he and I were saying - that space and enter, we shouldn't constrain them to being the same thing.

James C: The other kind of design goal in my mind that we're butting against here is that we need to make ARIA work the way users will expect, and the average voiceover user, the average keyboard user on Mac is gonna expect space to do the same thing that the average screen reader or keyboard user on Windows is going to expect them to do. And I don't think it's a good design practice to say, well, we're going to skew the interaction towards the Windows user, and Mac users just have to deal with it, or we're going to skew the interaction towards power users and the lay users just have to deal with it.
So the space versus enter thing, to me, that's absolutely critical to the success of ARIA practices. We need to make it work the way users expect, not the way it's convenient for us as spec authors to get around these design limitations.

Sina: But the way they expect on their platform, just to be clear, right. So in other words, I don't think we're saying enter should work like space does in Windows on Mac or or vice versa, but rather on Windows space should behave like space and on Mac enter should behave like enter... like, you know. It should be platform specific, right, that's what their expectations are.

James C: Enter almost always - unless there is a default button (and there is no such thing as a default button on the web so far, unless you've kind of styled things that way) - enter usually does the same thing on Mac that spacebar does.

Sina: 100% agree, but I'm asking, are you saying, with your previous comment, that on Mac users have certain expectations of what space does and on Windows users have certain expectations of what enter does. We shouldn't move one towards the other - I am fully down that road with you. What I'm asking is, however, on Windows users also have expectations of what space does and on Mac users might have expectations of what enter does... the inverse of those two things. By making them the same on both platforms. It seems like it's the worst of all worlds. I'm just saying they should behave the way they should behave on the platform that they are on.

Matt: In general, we haven't found very many of those kinds of conflicts Sina, it'd be good to look at specifics, but I just agree 100% with both of James' points. One is the purpose of aria is to make accessible whatever UI appears on the web. I know, Carolyn, you're trying to start with, "Well, we're going to make one that is accessible." - Usable accessible, right. But basically that is ARIA, right, that's what ARIA does. You throw junk on the web, and the APG says here's how you make that accessible.
And then the second point that the keyboard should - and APG has some Mac gaps for sure - so anyway, I agree with your points, James.

[majornista]

Per September 3 Deep Dive on Trees discussion, here is a link to a page that contains CSS style examples of various tree design patterns we are trying to support in our design language: https://opensource.adobe.com/spectrum-css/treeview.html. Note that some of the examples, like the Thumbnail pattern, might be better suited to the TreeGrid design pattern, and that the examples are not fully functional implementations of the WAI-ARIA Tree design pattern; they're only meant to demonstrate the various CSS styles.

Here is another example, from the open source Coral-Spectrum javascript framework, that implements a multi-selectable tree with some disabled nodes using WAI-ARIA. Note that this implementation uses aria-live and additional screen-reader only text to announce the selected/not selected state of tree items when item selection is toggled. In this implementation, Space selects the focused item and Enter or ArrowRight/ArrowLeft will toggle the expanded or collapsed state.

[carmacleod]

Deep Dive 10-minute homework. :)

Please try out the experimental Carbon multiselect TreeView.
I'll paste the link below, but please read the notes first.

Notes:

• Recall that this tree has an "active item" that is represented visually by a blue strip on the left and marked up with aria-current="true". Authors using this component will typically open the active item in an associated editor or viewer pane. To "activate" an item, use click, space or enter.
• Arrow keys open/close and move focus without changing the selection.
• Ctrl+click (win) or Cmd+click (mac) adds an item to (or removes it from) the selection.
• Ctrl+space (win) or Control+space (mac) adds an item to (or removes it from) the selection. This diverges ever-so-slightly from the recommended APG selection model by borrowing one shortcut from the alternative selection model, because in this tree unmodified space is used for activation.
• Shift+click and Shift+space for contiguous selection are not yet implemented, but they will be soon.
• This tree does not have checkboxes, checkmarks, or aria-checked. (Maybe someday that will be a requirement, but not today. Would be nice to have yes/no consensus around checked/selected items, just in case).
• NVDA seems to be the only screen reader that announces selection state (i.e. "not selected") in a tree. JAWS and VoiceOver don't mention selection. That seems buggy. I'll look into this more tomorrow.

Modulo not being able to do contiguous selection (yet), please let me know if you find this tree easy to use.
We can discuss this selection model during the deep dive call.

Here's the link to the experimental Carbon multiselect TreeView.

Thanks, everyone.

[JAWS-test]

@carmacleod

NVDA seems to be the only screen reader that announces selection state (i.e. "not selected") in a tree. JAWS and VoiceOver don't mention selection. That seems buggy.

The reason for this could be in VoiceOver the lack of aria-multiselectable=true on the role=tree. VO then does not output the status because it assumes that focus and selected are identical.
In JAWS this is bug since it occurs also with aria-multiselectable=true: see FreedomScientific/standards-support#432 (comment)

[JAWS-test]

@carmacleod
In the carbon example, the deactivated treeitems do not get the focus and are also not perceptible with the virtual cursor. This can be ok, but also problematic if deactivated treeitems transmit information (e.g. that these treeitems exist or have a certain status like selected). See https://www.w3.org/TR/wai-aria-practices-1.2/#kbd_disabled_controls:

For the following composite widget elements, keep them focusable when disabled: ... Tree items in a Tree View

[majornista]

For the mobile use case, with VoiceOver for iOS, there is no way to expand/collapse or multiselect items, because there is no toggle button to expand/collapse and no checkbox to indicate selection for VoiceOver to focus.

[carmacleod]

@JAWS-test

The reason for this could be in VoiceOver the lack of aria-multiselectable=true on the role=tree.

Oh - of course! Thank-you! I thought for sure I had checked that when I first tested this weeks ago. I guess I was in too much of a hurry last night. I even had the thought that it's as if VO thinks the tree is single-select! I'll see if I can get that fix in this morning.

For the following composite widget elements, keep them focusable when disabled: ... Tree items in a Tree View

Thank-you again! I don't think I ever noticed that section of the APG. We will make those focusable. I did notice the weird behavior (mentioned in point 5 of the opening comment) but I figured it had something to do with @mcking65's response:

JAWS and NVDA do not render a full tree in reading mode. This is by design; same is true with listboxes.

@majornista

For the mobile use case, with VoiceOver for iOS, there is no way to expand/collapse or multiselect items, because there is no toggle button to expand/collapse and no checkbox to indicate selection for VoiceOver to focus.

I will admit to having no experience developing for mobile. Would people typically implement a different component on mobile? One that has separately-checkable checkboxes and separately-tappable twisties? Would that have to be a treegrid? I see that you linked to some examples in #1311 (comment) - I will try to look through them before the call.

Sincere thanks to both of you for your feedback. I wasn't trying to get free debugging (was only trying to have discussion points for the call), but I'm grateful for it. If we ever meet at a conference (when this pandemic is over), I owe you both a drink. :)

[carmacleod]

The fix for aria-multiselectable is in (heh, my first-ever Carbon code contribution 😄 ), but sadly, VoiceOver still doesn't announce aria-selected state. On the plus side, JAWS does announce "selected" in Firefox now (but not in Chrome).

[carmacleod]

Here is the raw transcript from the previous call (very sorry - I am out of time to clean it up).

2nd Deep Dive on Trees

Carolyn MacLeod 00:01 We scared them off with the first round.

James Nurthen
00:08
We have, we have more people turning up now.
00:11
And I will ask once they're here and just let them know we are recording this meeting.
00:17
So that the people who have just joined know we are recording this meeting. If you object to that, please speak up.

Carolyn MacLeod
00:24
Haha, we have D.A. and

Sarah Higley
00:27
Ryan enjoying Ryan's my colleague

Carolyn MacLeod
00:30
Okay. Hi, Ryan. Nice to meet you and DA is my colleague

James Nurthen
00:37
And john just let you know we are recording this meeting. If you object, please let us know.

Carolyn MacLeod
00:44
Okay. Um, so I don't know if anyone had a chance to look at my takeaways from the deep dive notes that I just threw in yesterday.
00:55
Apologies. I'm on vacation, actually. So I didn't have a chance to really go deeply into it but
01:06
I did. Okay, so the first thing we seemed pretty
01:12
We all can there was a general consensus that our current was okay. If you're going to have an active item. And so I think probably will just go with that.
01:27
Any objections. The other question that comes up to, that's totally related is should we put our controls on the tree to point to the side panel.
01:38
So if anyone has anything interesting to say about that. I mean, obviously, airy our controls will maybe work maybe not work, depending on the screen reader and etc but probably can't hurt to have it right
01:57
Hearing no objections.
01:58
I'll move on to
02:01
The space. Enter Windows, Mac checkboxes or not discussion.
02:10
Checked selected, I guess is a better description of that discussion.
02:16
I'm not sure that we actually came to any final conclusions, but I wrote down the points that I believe we did say
02:30
Don't make space and enter, do the same thing on one platform.
02:36
So split them up because it's a waste to have those two useful keys, doing, doing the same exact thing. So Windows and Linux typically use enter for quote activation quote and Mac typically uses unmodified space for activation. So it means that on Mac.
03:03
You can't really use the AP, geez. We're missing, Matt, you can't really use the AP, geez.
03:11
Simplified selection model, which uses unmodified space for selection, so that
03:20
Kind of necessarily puts us into the additional selection model, which uses
03:27
Will find

James Craig
03:29
One very or one I guess caveat to that is that there are too many
03:35
Instances of web controls that I've come across that have both selection and activation. There are a few, but like, it's pretty rare.
03:47
And if they do have selection then then they make it work with mouse by putting a checkbox or something in the row as well like Gmail is the example of this, right, if you just click on the road. It's an activation
04:01
Like yeah mail message. And if you click on the checkboxes to the beginning of the row. That's the selection.
04:06
Right there hasn't really been a problem.

Carolyn MacLeod
04:09
So I think emails a tree grid, if I'm not mistaken.

James Craig
04:13
I haven't used it as an example of like something that we can activate in select

Carolyn MacLeod
04:18
Right, right, right. Okay.
04:22
Because tree grid sort of has different key. I mean, we'll have to have a huge discussion on that someday, too, because it's a whole other ballgame. Um,

James Craig
04:33
But remember they're they're trying to make these controls work intuitively with the mouse and not just with the keyboard.
04:39
Yeah, and so there isn't really a difference between select and activate with the mouse. And so they usually just treat them both is click and from the spirit of perspective, that's what we simulate as well as you know we've always stimulated a click event record, right.
04:54
What kind of source of income source physical event was

Carolyn MacLeod
04:57
So you're saying if there's a checkbox in the tree.
05:01
He you
05:03
On modified space would check it.
05:07
And so you can't really have selection.
05:12
You are even though you don't have activation, the

James Craig
05:15
checkbox leaf node. Yes, that that is the expected keyboard P, like if they were actually using the keyboard and they hit the spacebar, then they would expect the checkbox.

Carolyn MacLeod
05:26
Right, right, presumably also if you're on an expandable node apparent node, because there's that mix checkbox that may or may not be trackable, which probably is, which means check all the guys below me.
05:40
I don't know. Right. It's

James Craig
05:43
So headroom upon that you're talking about like a like a
05:47
Period.

Carolyn MacLeod
05:48
Yeah, watch that box that can check all the ones below it. Yeah, yeah.

James Craig
05:53
The case. Yeah.

Carolyn MacLeod
05:54
I think most of them.
05:55
Do
05:56
That I've seen anyway they let you click on or check the parent node and then that automatically
06:06
Checks all the children.
06:12
Um,
06:14
So yeah, so
06:17
So space, I guess, can be finessed you're saying on Mac maybe

James Craig
06:25
I guess what I'm saying is one I haven't said this yet, but I'll get to it.
06:33
As far as the main kind of activation activation versus selection. I don't think that we should separate those two by platform because it's going to be really confusing for authors and some users.
06:50
Like from time to time people switch back and forth between Windows and Mac sometimes we've got one at work at home.
06:56
Or sometimes they've changed jobs. And so they're coming from the Windows side they're working in an apple now and they're they're learning it so
07:02
They don't have these like set expectations, like I'm on Mac. So like they're not conscious of like I'm on Mac, so it must be spacebar, they will, you know, try what works and some sometimes that's return or enter
07:16
Sometimes spacebar and the most users don't think about that and most authors don't even think about that, if we can get. I think about it at all, we should think about like listen for both because they mean, same thing from anything more complicated than that, I think, is a recipe for
07:33
Confusion

Carolyn MacLeod
07:34
Okay. One of the things we said, oh, you agree, Sarah. Yeah, I just one of the things we said is, don't make space on enter, do the same thing.
07:43
Maybe

James Craig
07:43
I just disagree with that. I heard
07:46
I prayed that last week I recommend. I definitely agree that we heard that last week, but I disagreed. I thought at the time.
07:52
Okay.

Sarah Higley
07:54
Fair enough, disagree with that. So,
07:56
I would instead it's we've done on like things I found our people expect enter to do a thing on Windows as well. Even when it doesn't on native
08:05
Controls. So even like when we make custom controls, I recommend that we have space and enter both work in both do the same thing. And like, because that's the thing we've observed and having them do different things would be particularly weird

Carolyn MacLeod
08:18
UK yeah I'm seeing

Sina Bahram
08:21
Even though that a young i just i don't i don't agree space and introduce different things as the screen which we use there.
08:27
I also think that it's really like I would, I would love to live in the world where you can switch from a Mac to PC and have all the keystrokes behave the same that's just not true. It doesn't work that way.
08:37
Like, that's not how those platforms work.
08:41
You, you can't use jaws commands and expect voiceover to behave in a similar way, it's just, it's not a thing. And so I love it as a goal, but I think
08:50
If we're doing that and we have such a limited number of keys to deal with in the first place, removing half of those, you know, or some large percentage of those gets us into an even worse lowest common denominator place than we already are on the web and

Isabel Holdsworth
09:07
Do not have to think about what users.
09:10
Currently do because I think if you were to take a straw poll of screen reader users half would you space and half or two center. So, so, which one do you choose.

Sina Bahram
09:19
I think it depends on context if there was a health message assigned at the time. What they're if they're a novice intermediate or
09:24
advanced user how long they've been using that platform. I mean, I think there's five or 10 different stations have dicing the data I totally agree.
09:34
That these are completed, and I, I completely agree that in certain contexts. They absolutely should do the same thing, like on a toolbar.
09:43
I just expect space and enter to do the same thing because it's just a button and there's no secondary action that's up but if there's a message that says that there's a secondary action or if it says a split button instead of a button. And there's, you know, then an expectation to say
09:58
Okay.
09:58
Now I have to pay a little bit more attention here. I'm not, you know, I'm not necessarily making a judgment call here that that is a good or a bad thing, but I think it is a real thing.
10:08
And I think we should not just devolve this to not being able to differentiate between selection and activation in a tree to

Isabel Holdsworth
10:19
Help messages be delivered with custom Jill control to action controls.

Sina Bahram
10:24
Or sometimes they're needed. Right, so like voiceover NBA and jaws. I'm a little rusty on Orca.
10:30
All have native messages that you can turn on and off like like Twitter messages that say, you know, press least activate

Isabel Holdsworth
10:36
Yeah, I'm thinking more like more of custom controls that
10:39
we're assigning roles.

Sina Bahram
10:41
Yeah. Hundred percent i think i think that i think that those messages are incredibly helpful, especially as you're learning and interface.

James Craig
10:49
So I'd like to acknowledge that seen as objection while while true in the cases that he mentioned, I think, is invalid here and bear with me. But like
11:02
He's absolutely right, like the square meters, and especially power users know the screen readers do have different behaviors for different keys.
11:10
But one one issue that we're not just talking about screeners right we're trying to make full keyboard access work for everybody. So I've got a very limited set
11:18
We've also got lazy users and advanced users that don't know as much even as as a lay screaming to use it right at least banner user, you have to have, you have to be invested in the interface and figure out a lot more about how it works in the average user does
11:33
And. And the third thing is the the platform switch right like and there seems to be my switches on Mac if for some reason. If it's a link if the return key you know spacebar.
11:46
And all those differences mean that the web, you know, is effectively we were limited to the lowest common denominator for a lot of these
11:56
You know, kind of expected key controls and that's why I'm recommending that we have return in spacebar both the kind of activate or selecting this logical scenario.
12:06
If we get too far outside of that and we start saying on Mac do this one thing and on Windows do this one of the thing we're going to lose the authors and even if we don't lose the author is we're going to, we're going to have some user expectations that are broken.

Sina Bahram
12:20
So how can we achieve both

James Craig
12:23
Keep it simple spacebar and returned to the same thing.

Sina Bahram
12:26
No, no, no. I, oh sorry, I meant, how can you, but if you have a tree view that as checkboxes. What are you recommending

Isabel Holdsworth
12:33
Check the checkbox on this level and

Sina Bahram
12:36
double the amount of keystrokes.

Isabel Holdsworth
12:40
If it helps users to understand how to use their application and my big thing today.

Sina Bahram
12:46
I just, I think that it's absolutely true that there is a higher cognitive burden and I would love to see some studies.
12:52
That amortize that cost over the lifetime of the usage of the application when we're in this one design decision with one fell swoop doubling the amount of effort that's

James Craig
13:04
What we're doubling
13:06
Check your
13:06
Siblings in China.

Isabel Holdsworth
13:08
We don't have a lot of effort or confusion.

Ryan Shugart
13:12
I've worked with a number of reviews.
13:16
In Windows and the web. I have never expected space or enter to select something if you're moving through a tree view and windows as I down arrow.
13:28
That next item is just automatically selected take that in any MMC based application or anything like that. As you down arrow.
13:37
It selected. If I want to take actions on it. I can you ship def 10 bring up the context menu.
13:42
And that's all my secondary actions. There are no I have never seen in Windows checkboxes in a tree view until Windows eight and the File Explorer came out in Windows eight.
13:53
The only reason there's checkboxes in that preview and list view is for because that's when Microsoft first introduced touch.
14:00
Touchscreen devices.

Isabel Holdsworth
14:04
This is part of a bigger issue because we are seeing more and more kind of general action controls, say, a navigation bar at the top of a web application where
14:17
You can hover over to drop something down or you can click on it to go to a new page or whatever.

Sarah Higley
14:25
In that case, I mean, God has introduced this whole own set of accessibility issues and often having like the activate link and then next to it like a drop down control has like been kind of the solution to that that I've seen hold up the best. So even there.

Sina Bahram
14:38
I agree with that. I totally
14:40
In that use case.

mijordan
14:41
That's exactly. I know that edit.
14:46
In our experience, we do have use cases for multi select tree view where more than one

Stefan
14:53
Way to seven here sorry to say that this is frequently use especially in installation package is do you want everything give you the full monty of everything below and everything was a check that one so
15:06
I can also mix states, of course, but I want to say one thing to what signer said about these two tone messages I agree that they are helpful.
15:15
But what I consider a deficiency in our area so fires that there is nothing that is overriding if defined that therefore tutor messages for roles in AWS. Yeah.
15:30
Because there are situations really where you have to modify that for the sake of the benefit of the end users here if you do have a bit from the standard that is announced yet, especially for taps trips as an issue. I think completely agree with that.

Sina Bahram
15:47
hunger for some

James Craig
15:49
Good. Thanks a lot, sure I understood that, can we get you to state that will work.

Stefan
15:55
Yeah, okay.
15:58
Suppose you have a tab strip navigation into place and for a single tap jaws recognizes that are that are by bit principle to patterns. Yeah, you can directly control press control tab to go to the next tab and but also you can use arrow keys to goes in there to the next tab here.
16:21
I mean, there are different patterns already starting at the control concepts that exists here that require different keyboard usage.
16:33
Not speaking of the say of different platforms is also already the case in the Windows platform. Yeah, you have taps taps trips, where you
16:42
Directly switch tabs by different means. Yeah. Different keyboards.
16:47
But this is only one example. We have more complex examples, but if you're interested, I can prepare list and making an item to that in the gyro or in the end of the GitHub sorry us. But yeah, there are cases where this comes beneficial. And I think that has also some examples of
17:08
Maybe

Sina Bahram
17:09
Having environments where the ones I was blessed

mijordan
17:15
Yeah, I mean, anytime you're using a tree as a, you know, to represent a file structure where you can select folders or items. I think you have to have
17:27
I think
17:30
Between item focus and selection is important because you want to be able to multi select and
17:38
Distinguishing between the behaviors of oh okay I'm activating this item to drill and see that I view that item or I'm selecting this item. Those are two different tasks and

Ryan Shugart
17:52
What if you want to bring up a context menu on an item, the selected do not select it, the activated.

Carolyn MacLeod
17:59
You focus it

Sina Bahram
18:00
Focus and and had the context menu invocation key.

mijordan
18:03
Yeah yeah that two plus 10 or

Carolyn MacLeod
18:07
10 on Windows and Linux.
18:09
Yeah.

mijordan
18:11
Um, the other

James Craig
18:13
Thing that what I would say here is that specifically with that question.
18:18
Most users and we got to go with with the lasers are going to are going to figure out how to do their
18:26
Context menu and it's going to be through a right click or some kind of simulated right click now yes on some keyboards, there is a key that does the same thing. And maybe simple keyword access users are going to know that.
18:39
Spirit of users are almost certainly going to know the way to do that, whether it's to that key or with this, you know, like a voiceover it's VO shift him if I recall correctly.
18:49
But we got it we got to do the simplest
18:53
The simplest lowest common denominator for these web apps until we we get some kind of very specific control over meaningful events or semantic events.

Isabel Holdsworth
19:05
I don't know that a screen reader would think to right click on a
19:09
Control within a weapon.

James Craig
19:11
Most period of users would not, I'm talking about
19:14
General users, right, we're trying to solve the problem for more than just for your users here.
19:24
There is a context menu event in JavaScript. And so that is something that I think a lot of users can effectively initiate but it's not going to be the, you know, it may, I think it's rarely going to be the keyboard and the key on the keyboard.

Sarah Higley
19:42
Question, not specifically about context menus. Um, there's been like, people have been talking about it. I'm
19:50
Like what works best for trees that have multiple like selection and activation. Are there any examples like concrete examples where someone's like done user studies on and had any data on on how people intuitively interact with that sort of tree.

James Craig
20:13
I can see answer is probably yes.
20:21
What I think is probably less likely is the you know the breakdown of like heavy
20:27
screen reader users over windows vs Mac greater users use those intuitively vs full keyboard access users on Windows vs Mac or Linux.
20:37
That's the more complicated.
20:39
Thing here, but that would be great to know, Laura.

Sarah Higley
20:42
That's kind of what I would want to know. Maybe before we come up with like any concrete or a decision.
20:49
It seems like it should be based in like maybe more than just the opinions of people on this because

Carolyn MacLeod
20:57
It should also take mobile into account.

mijordan
21:00
Yeah, absolutely.

Carolyn MacLeod
21:02
And that's a tapping right there's only one kind of tapping one finger, unless you're tapping two fingers. I don't know you starting to get into different kinds of things that are going on different gestures and if you tap on a tree control what is it do select activate or check

mijordan
21:19
Expand
21:20
Or collapse or

Carolyn MacLeod
21:21
Expand, collapse. Thank you. Yeah.

James Craig
21:24
Yeah. As of this spring move Android and iOS have standard full keyboard access or sorry, full keyboard access separate from the square meter usage.
21:36
On the context menu is typically tender long presses are long, you know, tapping holders. Another way to describe it.
21:44
So those are all those are available to Members different assistive technologies and mainstream users that use these kind of pseudo assistive technologies like full keyboard access

Sina Bahram
21:54
I apologize for not pasting that link into IRC. I'm not on there. But if someone would be so kind to duplicate it over there, though.

James Nurthen
22:02
That there's not much in the IRC. So I will put it in the other places. Well, I think.

mijordan
22:09
I'm
22:12
Are i mean that those sort of full

James Craig
22:15
keyboard access

mijordan
22:17
You know mechanisms, you know, on a touchscreen device. Are we, how are we going to make that work with the JavaScript based application. And I think that's the concern is like
22:30
VoiceOver has a very
22:32
Limited, you know, ability in the JavaScript application to be able to, you know, activating a control and and distinguish between ways of activation of a control.

Sarah Higley
22:46
The context menu event like directly looking into the event should work.

James Craig
22:51
That would work. Yes, it does work.
22:55
That one works today if you trigger it via like save VO shift in
23:00
There's some other
23:05
See
23:08
You're here is

mijordan
23:11
Your
23:13
I mean,
23:15
Do most users like connect a keyboard to their, you know, mobile device when they're, you know, operate.
23:23
When using their

Sarah Higley
23:24
IPhone WordPress, should get you the context menu on an iPhone.

James Craig
23:28
Yeah, with voiceover You would effectively do something like a double tap and hold, which will pass through the long press
23:36
Um, so the link that I just posted in the zoom chat is to a new section of explain there and incubation project and it's talking about which kind of platforms specific accessibility should simulate
23:54
Which JavaScript events.
23:57
So, there actually is a context menu events and so that one's actually fairly, fairly easy love to simulate it. We were doing that anyway and in all the right right places. But for something like
24:11
If a user were to
24:15
Increment or detriment. That's for example a touchscreen, iOS voiceover device if you slide to a slider and it's something that can get an increment detriment in the swipe left swipe down would actually
24:29
Simulate different arrow key.
24:33
keystrokes depending on the context of right to left or left to right or vertical sliders, etc.
24:38
Same thing with a few other ones like one of the ones that James there than just brought up that we talked about.
24:45
Earlier this week was expand and collapse on tree controls and so that can simulate specific events as well.

mijordan
24:56
So the idea is to use the incremental detriment to simulate the
25:01
expand or collapse on a tree control.

James Craig
25:04
Well the idea is to use an arrow key event. So regardless of whether the
25:11
It's a screen reader user or keyboard user or an iOS or Mac user, it's going to look like they hit the key on the keyboard.
25:20
And in the case of something like multi select it's going to look like they hit you know meta, meta plus click instead of
25:29
You know, which is effectively command click
25:36
The goal. There's two goals. One is that right now. You're right. There's, there hasn't been much way for a screen reader and at to kind of convey its intent.
25:46
To the web application. And so that's the main portion of it, but all the ways we tried before there was some risk that the user was going to be
25:56
Kind of added as a user of assistive technology. And so the lowest common denominator that we got to in this case is, let's just simulate the events and web applications are listening for anyway.

mijordan
26:12
I think that's fair. I, I, I fear that the
26:18
Figuring out how to interact with a tree control is still going to be a problem.
26:25
For
26:28
Yes, someone using a mobile screen reader, because
26:32
Right now pretty much all of its announced is that it's an item. I don't even know that it announces as a, as a rule of tree item right now if I for every call and
26:46
When that if that's the only thing that can receive focus with industry item, then
26:54
You have to distinguish between this context menu and what it does, versus
27:01
You know,
27:03
Distinguish between selection and and activation or expansion and collapsing of the controller or collapsing of control. I think it's still difficult. You know, I think.
27:17
Practice children.
27:19
Have of
27:21
Of a tree item, which is kind of the hack that I've used right now.
27:27
For this behavior.
27:29
Which is like if I'm on mobile, throw it in interactive checkbox to toggle it state, you know,
27:37
And so that it gives someone the opportunity to to focus some sort of control and actually activate and talk. What

James Craig
27:48
Do you think the complication here is that we've got
27:52
Controls that at least some people want to want to call managed focus controls, right, like a one tab stop type of thing. And for a tree that
28:03
Seems reasonable, most of the time if it's a simple tree. But as soon as we start adding in these things like selection and activation that gets more and more complicated. So just as an exercise, we have a little bit time
28:16
And what if we thought about this tree. They were talking about as a tree grid. Let's make it a little bit more complicated.
28:23
So we can figure out like how would we do this in the context of a of a tree grid and then bring it back and say, Is that okay to do the same thing in the tree.
28:31
So I'm trying to make the tree greatest simplest as possible. Like, let's you know let's use again the you know webmail table right where there's three columns in the first column is usually that selected, you know, selected or D selected checkbox, you know, the next
28:49
next column will say is the sender and the next column is the subject line you can update on there too long and
28:56
What if, if we're able to make it as that, you know, a single tab stop the way we would probably do that as a tab into the table and an arrow keys actually changed the selection.
29:06
And you're moving down the the particular you're moving down each row but staying within the particular column. So if I'm on a subject line. I'm just gonna go into the subject line. And if I arrow.
29:17
Assuming a Western context. If I era left, and that's going to go back to that checkbox at the beginning of the row. And so they were actually on two different cells and we can make the the activation behavior versus selection behavior.
29:32
Contextual to that cell right so spacebar or more return in the first column that has that checkbox.
29:39
Whether we're on the checkbox, or whether we're on the cell like we can know like the user means to select the row. And if we're on any of the other ones like that.
29:46
Typically cling on after that and then interact with things like the line of text that represents subject line that can be a standard activation
29:54
So that's the more complicated example which seems simpler from a user perspective than a tree which tries to jam multiple interactive things into a single row without some kind of contextual shift between them.
30:08
Right.

mijordan
30:13
Right.

Sarah Higley
30:14
And grid or like flexible lists or list box and grid where you have a list box with multiple items as well. And then you want option as you turn it into a grid and you have each
30:24
Interactive item be a separate grid cell and the other option is try to jam them in to one option makeup keyboard interaction.

Stefan
30:34
This is exactly the place when you do that to give some to to a message we, as we call it the jaws. Does that the users informed that this is at this place available and I are key shortcuts won't help us here and this is this is
30:50
This is a degree of information that is lacking because it gives us currently by area means here without using our area.
31:01
Described by information ARIA description. Yeah, this is an alternative, but this is a poor man's
31:08
alternative to that what we would really need that case. Yeah.

Sina Bahram
31:12
And it and it prevents you from putting other more useful information.

Carolyn MacLeod
31:24
So we need more examples of tree grid way more
31:29
tested thoroughly user tested, etc.
31:37
Sorry, say again.

Sarah Higley
31:38
The problem with testing it now is that it has bad supporter

Carolyn MacLeod
31:43
Yes. That is unfortunate.
31:46
Yeah.

James Nurthen
31:47
Yeah.

mijordan
31:48
Pretty much in any tree grid that I've used we
31:53
Are that that I've developed I we've had to kind of
31:57
Add on you know
32:00
Like our a live region support, just to be able to announce that something got selected, you know, like if you're multi selecting between rose in a tree grid, you actually have to, you know,
32:11
Use. Are you alive to announce that selection, particularly on on on with VoiceOver on the Mac.

Sarah Higley
32:17
Even getting into like scan mode grandkids grid controls not working and like not announcing
32:23
Like you're in and not staying in the same. Yeah.

mijordan
32:26
Or or then being announced as both the table and a list, you know,

Sarah Higley
32:32
Mostly the testing. I've done on Windows, screen readers, at least has it announced, just as a tree actually like it doesn't tell you it's a grid and then you like end up in different that it starts announcing columns, but then you try to navigate was
32:43
Like control like the table commands that it doesn't work and or doesn't work like you expect it to work. And so it's like even with live like even if you try to like fake it with live regions, it's hard to test because the likes. Screen reader interactions don't work.
32:58
Yeah.

Carolyn MacLeod
33:00
There's little bugs like
33:03
grid cell is a is actually browser bugs. They're, they're actually cells and vice versa, depending on if you're in a tree or tree grid. If there's little bugs like that that really throw things off.

James Nurthen
33:19
Right. Wow, it sounds like we need to fix all get get screen readers to fix all the photos. Before we move forward.

Carolyn MacLeod
33:25
Yeah, and browsers. Right. So all the

James Nurthen
33:28
Browsers, we can control a little bit
33:31
Yeah Joanie can can fix. Most of those things.

Carolyn MacLeod
33:35
James Yeah.

James Craig
33:39
And
33:42
Maybe this is diluting the topic too much, but the
33:46
Thought of an example of something that has a
33:50
Slight difference between
33:53
Activation actually maybe it doesn't. In the GitHub issues if you
34:02
Assuming you're one of the editors, or one of the members that can actually do this. You can click on the
34:09
Sign. These are labels or projects little gear icon.
34:14
Know the label is because it does have a little text and then the. It has a pop up list and either type ahead, where you can select and I think that there did it.
34:25
As you arrow, it will change.
34:29
It was probably just focus, rather than selection and that and that spacebar will actually change the selection well
34:36
The check people in this. And that's kind of the new list. Yeah.
34:42
And that's kind of something similar, but I guess, click
34:47
And over here, clicking spacebar books. Let's, let's say one thing, but do the same thing, which is select what selected activate
34:56
It, it's not a good example.

Sina Bahram
34:58
Well, just because activating is not a. Yeah, I think that's a little conflict, it is as you described. It's just, I don't think it gives you your multiple output paths, like you're you're triggered example did
35:09
You

Sarah Higley
35:14
Just thought. Um, I mean, I'd love to do a user study
35:19
Interested in like our team has some ability to do like small scale user studies with around like 10 to 12 people
35:26
Oculus if
35:30
I think the next one we could do is maybe in like a month and a half or two months.
35:35
If that's something like would all of you.
35:39
Would that be helpful, because this is something we've been questioning internally as well. So I think it would like help us to on
35:46
I'd be happy to like work with anyone on like figuring out the scenarios. I feel like I don't have a lot of concrete examples where like space and energy, different things on like controls in the wild. Now, but if like
35:59
Get help like figuring out what the scenarios should be and like what the variations, we should test should be on that could be a possible thing that it can do.

James Craig
36:10
And I'm willing to answer any questions about how
36:14
How the standards controls should work as to what works in the wild. I don't think anybody is upon what happens in the wild, because it's because it's different per, per implementation, like it's different for JavaScript API library, etc.
36:29
But generally speaking, you know, I can, I can describe when you would expect space versus return to do different things on that and
36:37
Then on Windows. It's usually, usually return to activate whatever is focused

Carolyn MacLeod
36:42
Sarah does your team have the ability to test on Mac as well.

Sarah Higley
36:46
Of course, yeah.

Carolyn MacLeod
36:48
Yeah.

Sarah Higley
36:49
We finally get we go through usability firm. They have like a pool of like testers with disabilities that they reach out to in some way.
36:57
Right.

Sarah Higley
36:59
IOS and Windows. And I'm like, not just screen readers as well.
37:04
You have different disabilities in these different at what we're not just testing windows, even for our own stuff.

Carolyn MacLeod
37:09
Just checking.

James Nurthen
37:10
One of the problems of course as you
37:12
Already mentioned, is we're going to find out stuff just doesn't work very well because the supports like crappy. It doesn't mean that
37:18
We shouldn't go forward with that that path.
37:22
Just because supports not there.

Carolyn MacLeod
37:24
So,

Sina Bahram
37:24
clustering around like what

Sarah Higley
37:26
Doing this and because it

James Nurthen
37:29
You know, it seems like

Sina Bahram
37:29
In visual UI I think James Craig made this point last week, he was making it in the context of, you know, the market tends to regulate itself with respect to ineffective UI is kind of go away.
37:41
Like in in visual sense because obviously the churn rate is a lot higher there.
37:46
My question is somewhat related to that, which is, you know, in certain applications where you're doing that for your job you're living in that application.
37:55
And so, in other cases you're encountering a control for the first time and possibly for the only time
38:01
On a web like for like a cart you're checking out as a guest and you may not ever buy from that vendor again.
38:07
So I'm just wondering what our goal is because if our goal is like him, it must be well as close to 100% intuitive implicitly as possible.
38:20
while minimizing burden versus in an application where one is going to be spending any significant amount of time, then what is an acceptable school up time just like there is for sighted users. And so I'm
38:37
really curious about that because I just, you know, I'm sorry to be passionate about this, but basically my life consists of doing things at one 10th, the speed of cited colleagues and so
38:49
You know, it's just really frustrating when I hear things that potentially can make that even slower, even if it's, you know, I completely agree with the intention, like I 100%
39:01
Agree with you and I really appreciate the fact that people are listing other cases then screen reader cases because I think inclusive design is really critical, but
39:11
You know, I thought, part of the tenants of that were adaptation and customization.
39:15
To an individual users use case. Now, James, Greg. Are you pointed out, we don't have semantic events. So we can't do that. We can't just say authors.
39:22
You know, respect and afford and model of selection activation focus, that's, you know, current Ness, you know, and then let the at figure it out. We just don't live in that world, apparently.
39:34
And so I get that we have to conflate some of these concepts up and down the stack. I just want to voice that that that concern that
39:43
You know screen reader users basically spend their life, you know, kind of devolved lowest common denominator possible and it doesn't really matter how smart you are, how capable you are that these interfaces. Can't even match you and so I totally get making it work for
39:59
You know novice users and intermediate users.
40:01
I just want there to be a pathway for novice users to become you know more efficient without putting all of the cognitive burden on them.
40:12
And respecting the priority levels that W three C is laid out in terms of it's okay to put more work on authors or spec or browser versus the user and I just saw

James Craig
40:23
Today, that's
40:24
Absolutely great points I've obviously been skewing my opinion more towards the let's let's recommend advice for the person who's potentially never been to interact with this control again, it needs to be as intuitive as possible, but absolutely recognizing, I think it's reasonable
40:41
To kind of give those exceptions, whether that be in a PG or something else where it's like, if this is
40:48
A web application that you know Customer Service agents at your company are going to use, day in, day out. And we can make it more efficient by by
40:58
Moving away from what the offering Practices Guide recommends that to me seems totally reasonable, right. It's a limited audience with some training expectations, etc, etc. So I think that that's perfectly reasonable
41:11
I mean,

James Craig
41:13
Good.

Sarah Higley
41:14
So the applications that Ryan and I tend to deal with are the ones where people spend a lot of time every day and and do you have ramp up time and
41:20
Even then, like the ones we have like specific ones where people like we have to give one specific team that goes way off the rails because and their excuses. Like, we want to make it more efficient.
41:31
And that one has like a ton of complaints from people who use screen readers about how like impossible to use it is on. Even though like technically if you learned every single keyboard shortcut and use it exactly the way they men it i think is technically accessible. Um, so I'm like,
41:53
explicitly telling people like okay if you think your application is this sort of application. You can ignore the APG or like ARIA that worries me a bit

Ryan Shugart
42:02
I would also say
42:04
That keep in mind when we're talking about these applications that people have to ramp up for in a job setting.
42:11
That implies that there's someone there to train this specific screen reader user on the specific screen reader way to work through it. And in my experience, that is not always the case. So, even those applications, the more standard, they are, the better.

James Craig
42:29
I think we're all in agreement on that even in the context where I said, you know, it's okay to change. I wouldn't expect like every control to work differently would only be those ones that are, you know, it would should work exactly like
42:42
A PG
42:44
I would say should work exactly like the APG in like 98 99% of the times, and if there's one particular control that the you know the agent is using
42:53
You know, let's say the customer service agent is using, like, you know, all the time. And then there's a specific you know shortcut key for that. And it's conveyed to the user, how to do that. And that's okay.

Ryan Shugart
43:06
That's a lot of IPS
43:09
I'm serious, to someone who's dealt
43:11
With these applications.
43:12
You cannot guarantee that
43:14
That training.

James Craig
43:17
I agree.
43:19
But we have
43:21
Let's say there's, you know, there's a bit of a specific web application.

Ryan Shugart
43:27
Where did the standard Ada, then you introduce a whole box of it.

James Craig
43:32
I absolutely agree. In most cases, everything should be as intuitive as possible. And that's why I'm recommending the advice.
43:39
Amongst the general web be do it all the same way and make it as intuitive as possible and simple as possible, but I'm also aware of places where there's a web application.
43:49
That is used by, you know, a few dozen people right it's got a team of developers and it's used by a few dozen people and, you know, less than 10 of those
43:58
Are, you know, screen readers security users and those users do get specific training on that thing. And they've actually conveyed back before this kind of a similar
44:07
Scenario that that senior just brought up, which is like, this isn't efficient enough if I have to use the other controls and so I want additional full keyboard access you know shortcuts and stuff like that. Even Gmail, right, like it's got
44:21
Email is done, you know, j and k to move next and previous web you'll use arrows to but it's
44:26
Good. You know, these other keys, do these things as well. See those compose that kind of thing.
44:31
Those are all okay

Carolyn MacLeod
44:33
So it's tend to we usually end this meeting now, but we haven't got past point one. I've been
44:42
In
44:44
Progressing this along. Um, I don't know if we can quickly dispatch with some things like one question was about disabled tree items do they make sense at all.
44:57
I couldn't with a screen reader. I mean, I didn't try. Voiceover It probably will work on base voiceover just guessing. But the window screen readers would not
45:08
Use you couldn't use Browse Mode to get to the rest of the tree, the disabled part, basically because apparently according to Matt jaws and NBA don't render the full tree and reading mode by design.
45:22
Or list boxes. So it's disabled tree items will never be seen is that does. Has anybody got any more experience with that.

Sina Bahram
45:34
Disabled versus read only right now.

Carolyn MacLeod
45:38
Right.

Sina Bahram
45:39
I do think it matters in the context of your question.

Carolyn MacLeod
45:42
Okay. Read Only would be kind of weird in a ternary totally agree.
45:49
Just semantically weird
45:53
Okay. Anyway, if nobody has anything further on that.

James Nurthen
45:58
Wants to disable tree I can even me.

Sina Bahram
46:01
I don't

Carolyn MacLeod
46:01
I don't know, but it's
46:02
Part of the design for this tree, Andrew. Do you have an answer. What's a disabled tree item. What does it mean

andrew wang
46:11
Yeah, I think it's just that exists but can't be interact with
46:16
I would say the example that immediately comes to mind is if you're performing work on and like network call for example, and they need to wait for it to finish and you want to prevent the user from further interacting with the tree and to that work to work has completed.

Carolyn MacLeod
46:32
I wonder if just putting ARIA busy on it would be better.
46:37
Then disabling. I don't know.

James Nurthen
46:40
If it's if it was a multi select tree then it just wouldn't be selectable and maybe that would be the similar kind of

Sina Bahram
46:47
Don't even even a single selecting it could be

James Nurthen
46:50
A bit we have no way of making something something not selected on a single select tree.

Sarah Higley
46:54
Really quick because it's 953 or, you know, go. I have a question. I would love like a list of concrete.
47:02
Examples of trees were entering space do different things are that were selected and checkers or different or like Cocoa Pebbles of the type of thing we're trying to look at how to solve.

Carolyn MacLeod
47:12
Perfect.

James Nurthen
47:13
Can we can be as close to the deep dive issue.
47:17
Yeah.

Carolyn MacLeod
47:19
Sarah Yeah.

Sarah Higley
47:22
Cuz then if if I can like have other people's help
47:25
Yeah, especially seen in Ryan or anyone else on any platform desktop or web

Carolyn MacLeod
47:33
That will be

Sarah Higley
47:34
Like start to look at what like basically what is out there currently

James Craig
47:38
I don't know that I've seen what I would call successful examples of that on the web.
47:44
I think
47:45
We're more likely
47:46
To find
47:48
platform specific versions of that.

Sina Bahram
47:51
So I just want to point out a confirmation bias concerned here or made a strong word. But that a lot of those applications are hidden behind enterprise like

Carolyn MacLeod
48:02
Right.

Sina Bahram
48:02
Yeah, I can send
48:05
So,

Sarah Higley
48:06
They, the name of the enterprise application at least and

Sina Bahram
48:09
Right, sure, sure, sure. That makes sense.

James Nurthen
48:10
And and sometimes it's possible to find screenshot of them.
48:14
Yeah, socially,

mijordan
48:15
Yeah, I'd like I might be able to share, like we may have some
48:19
You know, we're spectrum is open source. We may be able to share like design comps of, like, okay, this is what someone's you know saying a tree should look like and but we we may not have the implementation is
48:34
actually implemented.

Sarah Higley
48:36
Right, we're interested in implementations that people currently use, but like, yeah, if it's behind. If it's not, then either like a screen recording with sound of using it or description I think just like concrete examples of example of of
48:52
Would be separate.

Carolyn MacLeod
48:54
So does everybody on the call have the link to the issue the GitHub issue that we're talking about 1311 in the ARIA repo. It is in the group chat.

[carmacleod]

@majornista The Coral Spectrum tree seems nice. The screen-reader only text does make NVDA say "not selected not selected" when navigating through items, and JAWS double-speaks when an item is selected/deselected. (we need to get those screen readers fixed so that people don't have to do hacks like this to work-around screen reader bugs...)

Interesting that mouse click has the same "one at a time" behavior as space key. Do mouse users like that, or do they miss being able to select multiple items at once? I guess this works on mobile? I understand how selection/deselection would work with single-tap, but I can't see a toggle button for expand/collapse?

[sinabahram]

Regrets on the call, but we’ll make sure to submit some comments, either from myself or @jscholes on the treeview to help move this conversation forward. Also, quick thanks to @carmacleod for building this demo!

[jscholes]

@carmacleod From the notes:

To "activate" an item, use click, space or enter.
...
in this tree unmodified space is used for activation.

I don't find the presence of aria-current confusing to represent the active item in this specific example. I can see it being used in, say, an email application or Slack to indicate which folder or channel you're in, in the specific case that a user must press Enter to change the active context.

On the other hand, I do feel that it's only being introduced here to support an explicit selected state along with the need for manual activation. Arguably, if an application didn't need to support the multiselection of something, and/or the panel was automatically switched as user's navigated through a tree, selection could just follow focus. Hence we may end up with some trees which use aria-current to mean active and some which just use selected state for the same thing. aria-current wouldn't work with automatic activation, because a screen reader would say "current" before or after every item and it would become semantically meaningless.

How will users respond to differing indications of active item state across tree implementations? Arguably, the lack of explicit "selected" announcement by NVDA and JAWS on Windows has trained users to infer selected state in many cases. If there was a case of a tree where the active item was further down and used aria-current, but the first item was automatically preselected for some reason, would users incorrectly assume that the first item was the active one?

In addition to the above, when I load this page, the first item "Artificial intelligence" is reported by NVDA as being "not selected". My immediate thought is to press Space on it to select it, because that's ingrained in me from years of Windows experience. Having read the notes beforehand, I believe that Space should only activate the item and mark it as "current", but leave its selected state unmodified. But then something confusing happens:

1. when I do press Space, the first item is reported as being both "current" and "selected", but to my mind I haven't intentionally toggled its selected state at this point.
2. Marking the second item as "current" returns the first one to a "not selected" state, while selecting the second one. Again, at no point have I explicitly toggled anything to do with the selection, and have only changed the active panel.

Maybe I'm misunderstanding how the example should work... some clarity would be appreciated here.

Some misc. technical observations:

1. In Firefox with NVDA, Ctrl+Space seems to do the same thing as Space on its own (namely marking the currently focused item as active). I can't independently change the selected state of items without making them active.
2. The cardinality of items is incorrectly reported in both Firefox and Chrome. There are 6 top-level nodes, but the total number is reported as being 7.
3. The tree doesn't implement support for Home, End or type-ahead.

[pkra]

As per discussion elsewhere, would there be interest in a deep dive call about trees and mobile / touch?

[spectranaut]

Hey @smhigley James and I thought you might be interested in some of these points, as you are thinking about checked vs selected and interactive lists, etc