RE: Global Shortcut Keys and Screen Reader Accessibility?
"Matt King" <[email protected]> Wed, 29 Apr 2020 09:41:09 -0700
| Newsgroups | gmane.org.w3c.accessibility.general |
|---|---|
| Message-ID | <[email protected]> |
This is a multipart message in MIME format. ------=_NextPart_000_012F_01D61E0A.50C878F0 Content-Type: text/plain; charset="UTF-8" Content-Transfer-Encoding: quoted-printable Taliesin, this sounds like some amazing work! =20 Matt =20 -----Original Message----- From: Taliesin Smith <[email protected]>=20 Sent: Tuesday, April 28, 2020 5:59 AM To: Matt King <[email protected]> Cc: Karen Lewellen <[email protected]>; WAI IG = <[email protected]> Subject: Re: Global Shortcut Keys and Screen Reader Accessibility? =20 Hi Matt, I agree, it will be awesome to make the hotkey customizable. I hope to = make that part of future research. =20 =20 For now we=E2=80=99ve got Alt + k implemented as the hotkey to toggle = between paused and playing states no matter where the learner=E2=80=99s = current keyboard focus is.=20 =20 Basically, once the action in the simulation has been started, i.e. once = the photons are firing at the molecule; the hotkey combination can be = used to pause and play the action without the learner needing to move = their focus to the actual Pause/Play button. =20 As for role application, we only use it for custom interactions where a = native HTML option is not available. For example, we have successfully = used role application to make a grabbed balloon moveable in four = directions. As the learner grabs the balloon with a native button = interaction, role application is launched creating a 4-way custom drag = interaction, enabling a learner to move the grabbed balloon in any = direction. The learner can then use the arrow keys (or alternative = letter keys WASD) to move the balloon to rub it against a sweater or a = wall to explore how static electricity works. The balloon is released in = the same way to was grabbed. =20 From the beginning of our research on making interactive science = simulations accessible, we treaded very carefully with role application. = Our research with users tells us that our native and custom interactions = are quite intuitive and accessible to blind learners. That said, we have = found, thus far, that starting a custom interaction with a native one, = like a button, works better for blind learners than immediately = presenting a custom interaction upon focus. =20 The suggestions, advice, comments, perspectives I am exposed to on this = list are awesome. =20 Taliesin =20 ~.~.~ Available off list at <mailto:[email protected]> = [email protected] Inclusive Design Researcher PhET Interactive = Simulations <https://phet.colorado.edu/en/accessibility> = https://phet.colorado.edu/en/accessibility Physics Department University of Colorado, Boulder =20 > On Apr 28, 2020, at 4:18 AM, Matt King < = <mailto:[email protected]> [email protected]> wrote: >=20 > Customizable is definitely good. >=20 > I'd recommend avoid using role application. Please carefully read the = spec for role application before deciding whether to go down that path. >=20 > Matt >=20 > -----Original Message----- > From: Taliesin Smith < <mailto:[email protected]> [email protected]> > Sent: Wednesday, April 15, 2020 1:33 PM > To: Karen Lewellen < <mailto:[email protected]> = [email protected]> > Cc: WAI IG < <mailto:[email protected]> [email protected]> > Subject: Re: Global Shortcut Keys and Screen Reader Accessibility? >=20 > Hi Karen, > Great question. The answer, unfortunately is no. >=20 > For our simulations (PhET Interactive Simulations) we test in these = three pairs (VO & Safari, NVDA & FF, and JAWS & Chrome). That said, = while presenting at the CSUN conference a couple of years ago a person = in the audience tweeted that the simulation I was demoing worked great = in Orca on Linux. >=20 > I agree, the challenge is finding an intuitive combination that does = conflict with anything else. >=20 > I liked Jonathan=E2=80=99s idea of making the shortcut customizable. = We are currently doing research on adaptive features. >=20 > Taliesin >=20 >> On Apr 15, 2020, at 5:48 PM, Karen Lewellen < = <mailto:[email protected]> [email protected]> wrote: >>=20 >> Do you intend testing with Linux and its various screen reader = programs? >> Your goals are terrific, with my one concern being finding a key = combination that is not used by one of the scores of screen readers a = person might choose for their individual accommodating needs. >> Karen >>=20 >>=20 >>=20 >> On Wed, 15 Apr 2020, Taliesin Smith wrote: >>=20 >>> Hi Folks, >>> I am looking into the feasibility of global hotkey or Keyboard = Shortcut that would toggle a Pause/Play button in a simulated learning = environment regardless of where the keyboard focus is currently at in = the application. >>>=20 >>> While the Pause/Play button interaction is somewhat akin to how a = video player works, it is not exactly the same kind of experience in our = situation. >>>=20 >>> We are currently working on a science simulation called Molecules = and Light < = <https://phet-dev.colorado.edu/html/molecules-and-light/1.5.0-dev.44/phet= /molecules-and-light_en_phet.htm> = https://phet-dev.colorado.edu/html/molecules-and-light/1.5.0-dev.44/phet/= molecules-and-light_en_phet.htm> (note to hear the interactive = descriptions you need to use a screen reader - VO & Safari, NVDA & FF or = JAWS & Chrome). >>>=20 >>> In this simulated environment a learner turns a light source to fire = photons at a molecule. The learner can change the light source and the = molecule on the fly and observe what happens. >>>=20 >>> Learners can also Pause the action (the firing of photons) without = turning the light source off. When the action is paused, the learner can = use a Step Forward button to move the action (the photons) forward = little by little to examine more closely what happens when a photon = passes through or is absorbed by the molecule. >>>=20 >>> In interviews with blind learners, we found that learners were = confused by the Pause/Play and Step Forward buttons, especially when the = light source had not already been turned on. And if the simulation was = set to Pause, they were often temporarily confused why the light source = button would no longer fire photons. >>>=20 >>> We have made improvements to the descriptive experience by adding = aria-live alerts that indicate if the light source is off or if the sim = is paused, and why it might be useful to use the Step Forward button = when the Pause button is activated. We think these aria-live alerts will = create a much more intuitive experience (more user testing is pending). >>>=20 >>> That said, a few learners requested a global keyboard shortcut to = quickly Pause and Play the action no matter where their focus was. My = question to the list is, does any one have any experience or resources = on making a global keyboard shortcut that does not rely on focus and = works when screen reader software is enabled. I am assuming we would = need to use a modifier key. Something like Control + k or Alt + k. >>>=20 >>> This kind of Pause/Play and Step Forward interaction is used in many = of our interactive science simulations. A global hot key could be useful = for all learners whether they use screen readers or not. >>>=20 >>> Thanks in advance for any resources on accessible global keyboard = shortcuts. I have read this great medium article by Sasha Maximova, J, = K, or How to choose keyboard shortcuts for web applications < = <https://medium.com/@sashika/j-k-or-how-to-choose-keyboard-shortcuts-for-= web-applications-a7c3b7b408ee> = https://medium.com/@sashika/j-k-or-how-to-choose-keyboard-shortcuts-for-w= eb-applications-a7c3b7b408ee>, several times, and am looking for more = resources. >>>=20 >>> Taliesin >>> ~.~.~ >>> Also available off list at: <mailto:[email protected]> = [email protected] Inclusive=20 >>> Design Researcher PhET Interactive Simulations=20 >>> <https://phet.colorado.edu/en/accessibility> = https://phet.colorado.edu/en/accessibility >>> Physics Department >>> University of Colorado, Boulder >>>=20 >>>=20 >>>=20 >>>=20 >>>=20 >>>=20 >>>=20 >=20 >=20 >=20 =20 ------=_NextPart_000_012F_01D61E0A.50C878F0 Content-Type: text/html; charset="UTF-8" Content-Transfer-Encoding: quoted-printable <html xmlns:v=3D"urn:schemas-microsoft-com:vml" = xmlns:o=3D"urn:schemas-microsoft-com:office:office" = xmlns:w=3D"urn:schemas-microsoft-com:office:word" = xmlns:m=3D"http://schemas.microsoft.com/office/2004/12/omml" = xmlns=3D"http://www.w3.org/TR/REC-html40"><head><meta = http-equiv=3DContent-Type content=3D"text/html; charset=3Dutf-8"><meta = name=3DGenerator content=3D"Microsoft Word 15 (filtered = medium)"><style><!-- /* Font Definitions */ @font-face {font-family:"Cambria Math"; panose-1:2 4 5 3 5 4 6 3 2 4;} @font-face {font-family:Calibri; panose-1:2 15 5 2 2 2 4 3 2 4;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {margin:0in; margin-bottom:.0001pt; font-size:11.0pt; font-family:"Calibri",sans-serif;} p.MsoPlainText, li.MsoPlainText, div.MsoPlainText {mso-style-priority:99; mso-style-link:"Plain Text Char"; margin:0in; margin-bottom:.0001pt; font-size:11.0pt; font-family:"Calibri",sans-serif;} span.PlainTextChar {mso-style-name:"Plain Text Char"; mso-style-priority:99; mso-style-link:"Plain Text"; font-family:"Calibri",sans-serif;} .MsoChpDefault {mso-style-type:export-only; font-family:"Calibri",sans-serif;} @page WordSection1 {size:8.5in 11.0in; margin:1.0in 1.0in 1.0in 1.0in;} div.WordSection1 {page:WordSection1;} --></style><!--[if gte mso 9]><xml> <o:shapedefaults v:ext=3D"edit" spidmax=3D"1026" /> </xml><![endif]--><!--[if gte mso 9]><xml> <o:shapelayout v:ext=3D"edit"> <o:idmap v:ext=3D"edit" data=3D"1" /> </o:shapelayout></xml><![endif]--></head><body lang=3DEN-US = link=3D"#0563C1" vlink=3D"#954F72"><div class=3DWordSection1><p = class=3DMsoNormal>Taliesin, this sounds like some amazing = work!<o:p></o:p></p><p class=3DMsoPlainText><o:p> </o:p></p><p = class=3DMsoPlainText>Matt<o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p = class=3DMsoPlainText>-----Original Message-----<br>From: Taliesin Smith = <[email protected]> <br>Sent: Tuesday, April 28, 2020 5:59 = AM<br>To: Matt King <[email protected]><br>Cc: Karen Lewellen = <[email protected]>; WAI IG = <[email protected]><br>Subject: Re: Global Shortcut Keys and = Screen Reader Accessibility?</p><p = class=3DMsoPlainText><o:p> </o:p></p><p class=3DMsoPlainText>Hi = Matt,<o:p></o:p></p><p class=3DMsoPlainText>I agree, it will be awesome = to make the hotkey customizable. I hope to make that part of future = research.=C2=A0 <o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p class=3DMsoPlainText>For = now we=E2=80=99ve got Alt + k implemented as the hotkey to toggle = between paused and playing states no matter where the learner=E2=80=99s = current keyboard focus is. <o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p = class=3DMsoPlainText>Basically, once the action in the simulation has = been started, i.e. once the photons are firing at the molecule; the = hotkey combination can be used to pause and play the action without the = learner needing to move their focus to the actual Pause/Play = button.<o:p></o:p></p><p class=3DMsoPlainText><o:p> </o:p></p><p = class=3DMsoPlainText>As for role application, we only use it for custom = interactions where a native HTML option is not available. For example, = we have successfully used role application to make a grabbed balloon = moveable in four directions. As the learner grabs the balloon with a = native button interaction, role application is launched creating a 4-way = custom drag interaction, enabling a learner to move the grabbed balloon = in any direction. The learner can then use the arrow keys (or = alternative letter keys WASD) to move the balloon to rub it against a = sweater or a wall to explore how static electricity works. The balloon = is released in the same way to was grabbed.<o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p class=3DMsoPlainText>From = the beginning of our research on making interactive science simulations = accessible, we treaded very carefully with role application. Our = research with users tells us that our native and custom interactions are = quite intuitive and accessible to blind learners. That said, we have = found, thus far, that starting a custom interaction with a native one, = like a button, works better for blind learners than immediately = presenting a custom interaction upon focus.<o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p class=3DMsoPlainText>The = suggestions, advice, comments, perspectives I am exposed to on this list = are awesome.<o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p = class=3DMsoPlainText>Taliesin<o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p = class=3DMsoPlainText>~.~.~<o:p></o:p></p><p = class=3DMsoPlainText>Available off list at <a = href=3D"mailto:[email protected]"><span = style=3D'color:windowtext;text-decoration:none'>[email protected]= du</span></a> Inclusive Design Researcher PhET Interactive Simulations = <a href=3D"https://phet.colorado.edu/en/accessibility"><span = style=3D'color:windowtext;text-decoration:none'>https://phet.colorado.edu= /en/accessibility</span></a><o:p></o:p></p><p = class=3DMsoPlainText>Physics Department<o:p></o:p></p><p = class=3DMsoPlainText>University of Colorado, Boulder<o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p><p class=3DMsoPlainText>> = On Apr 28, 2020, at 4:18 AM, Matt King <<a = href=3D"mailto:[email protected]"><span = style=3D'color:windowtext;text-decoration:none'>[email protected]</sp= an></a>> wrote:<o:p></o:p></p><p class=3DMsoPlainText>> = <o:p></o:p></p><p class=3DMsoPlainText>> Customizable is definitely = good.<o:p></o:p></p><p class=3DMsoPlainText>> <o:p></o:p></p><p = class=3DMsoPlainText>> I'd recommend avoid using role application. = Please carefully read the spec for role application before deciding = whether to go down that path.<o:p></o:p></p><p class=3DMsoPlainText>> = <o:p></o:p></p><p class=3DMsoPlainText>> Matt<o:p></o:p></p><p = class=3DMsoPlainText>> <o:p></o:p></p><p class=3DMsoPlainText>> = -----Original Message-----<o:p></o:p></p><p class=3DMsoPlainText>> = From: Taliesin Smith <<a href=3D"mailto:[email protected]"><span = style=3D'color:windowtext;text-decoration:none'>[email protected]</span>= </a>><o:p></o:p></p><p class=3DMsoPlainText>> Sent: Wednesday, = April 15, 2020 1:33 PM<o:p></o:p></p><p class=3DMsoPlainText>> To: = Karen Lewellen <<a href=3D"mailto:[email protected]"><span = style=3D'color:windowtext;text-decoration:none'>[email protected]<= /span></a>><o:p></o:p></p><p class=3DMsoPlainText>> Cc: WAI IG = <<a href=3D"mailto:[email protected]"><span = style=3D'color:windowtext;text-decoration:none'>[email protected]</span><= /a>><o:p></o:p></p><p class=3DMsoPlainText>> Subject: Re: Global = Shortcut Keys and Screen Reader Accessibility?<o:p></o:p></p><p = class=3DMsoPlainText>> <o:p></o:p></p><p class=3DMsoPlainText>> Hi = Karen,<o:p></o:p></p><p class=3DMsoPlainText>> Great question. The = answer, unfortunately is no.<o:p></o:p></p><p class=3DMsoPlainText>> = <o:p></o:p></p><p class=3DMsoPlainText>> For our simulations (PhET = Interactive Simulations) we test in these three pairs (VO & Safari, = NVDA & FF, and JAWS & Chrome). That said, while presenting at = the CSUN conference a couple of years ago a person in the audience = tweeted that the simulation I was demoing worked great in Orca on = Linux.<o:p></o:p></p><p class=3DMsoPlainText>> <o:p></o:p></p><p = class=3DMsoPlainText>> I agree, the challenge is finding an intuitive = combination that does conflict with anything else.<o:p></o:p></p><p = class=3DMsoPlainText>> <o:p></o:p></p><p class=3DMsoPlainText>> I = liked Jonathan=E2=80=99s idea of making the shortcut customizable. We = are currently doing research on adaptive features.<o:p></o:p></p><p = class=3DMsoPlainText>> <o:p></o:p></p><p class=3DMsoPlainText>> = Taliesin<o:p></o:p></p><p class=3DMsoPlainText>> <o:p></o:p></p><p = class=3DMsoPlainText>>> On Apr 15, 2020, at 5:48 PM, Karen = Lewellen <<a href=3D"mailto:[email protected]"><span = style=3D'color:windowtext;text-decoration:none'>[email protected]<= /span></a>> wrote:<o:p></o:p></p><p class=3DMsoPlainText>>> = <o:p></o:p></p><p class=3DMsoPlainText>>> Do you intend testing = with Linux and its various=C2=A0 screen reader = programs?<o:p></o:p></p><p class=3DMsoPlainText>>> Your goals are = terrific, with my one concern being finding a key combination that is = not used by=C2=A0 one of the scores of screen readers a person might = choose=C2=A0 for their individual accommodating needs.<o:p></o:p></p><p = class=3DMsoPlainText>>> Karen<o:p></o:p></p><p = class=3DMsoPlainText>>> <o:p></o:p></p><p = class=3DMsoPlainText>>> <o:p></o:p></p><p = class=3DMsoPlainText>>> <o:p></o:p></p><p = class=3DMsoPlainText>>> On Wed, 15 Apr 2020, Taliesin Smith = wrote:<o:p></o:p></p><p class=3DMsoPlainText>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> Hi Folks,<o:p></o:p></p><p = class=3DMsoPlainText>>>> I am looking into the feasibility of = global hotkey or Keyboard Shortcut that would toggle a Pause/Play button = in a simulated learning environment regardless of where the keyboard = focus is currently at in the application.<o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> While the Pause/Play button = interaction is somewhat akin to how a video player works, it is not = exactly the same kind of experience in our situation.<o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> We are currently working on a science = simulation called Molecules and Light <<a = href=3D"https://phet-dev.colorado.edu/html/molecules-and-light/1.5.0-dev.= 44/phet/molecules-and-light_en_phet.htm"><span = style=3D'color:windowtext;text-decoration:none'>https://phet-dev.colorado= .edu/html/molecules-and-light/1.5.0-dev.44/phet/molecules-and-light_en_ph= et.htm</span></a>> (note to hear the interactive descriptions you = need to use a screen reader - VO & Safari, NVDA & FF or JAWS = & Chrome).<o:p></o:p></p><p class=3DMsoPlainText>>>> = <o:p></o:p></p><p class=3DMsoPlainText>>>> In this simulated = environment a learner turns a light source to fire photons at a = molecule. The learner can change the light source and the molecule on = the fly and observe what happens.<o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> Learners can also Pause the action = (the firing of photons) without turning the light source off. When the = action is paused, the learner can use a Step Forward button to move the = action (the photons) forward little by little to examine more closely = what happens when a photon passes through or is absorbed by the = molecule.<o:p></o:p></p><p class=3DMsoPlainText>>>> = <o:p></o:p></p><p class=3DMsoPlainText>>>> In interviews with = blind learners, we found that learners were confused by the Pause/Play = and Step Forward buttons, especially when the light source had not = already been turned on. And if the simulation was set to Pause, they = were often temporarily confused why the light source button would no = longer fire photons.<o:p></o:p></p><p class=3DMsoPlainText>>>> = <o:p></o:p></p><p class=3DMsoPlainText>>>> We have made = improvements to the descriptive experience by adding aria-live alerts = that indicate if the light source is off or if the sim is paused, and = why it might be useful to use the Step Forward button when the Pause = button is activated. We think these aria-live alerts will create a much = more intuitive experience (more user testing is = pending).<o:p></o:p></p><p class=3DMsoPlainText>>>> = <o:p></o:p></p><p class=3DMsoPlainText>>>> That said, a few = learners requested a global keyboard shortcut to quickly Pause and Play = the action no matter where their focus was. My question to the list is, = does any one have any experience or resources on making a global = keyboard shortcut that does not rely on focus and works when screen = reader software is enabled. I am assuming we would need to use a = modifier key. Something like Control + k or Alt + k.<o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> This kind of Pause/Play and Step = Forward interaction is used in many of our interactive science = simulations. A global hot key could be useful for all learners whether = they use screen readers or not.<o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> Thanks in advance for any resources on = accessible global keyboard shortcuts. I have read this great medium = article by Sasha Maximova, J, K, or How to choose keyboard shortcuts for = web applications <<a = href=3D"https://medium.com/@sashika/j-k-or-how-to-choose-keyboard-shortcu= ts-for-web-applications-a7c3b7b408ee"><span = style=3D'color:windowtext;text-decoration:none'>https://medium.com/@sashi= ka/j-k-or-how-to-choose-keyboard-shortcuts-for-web-applications-a7c3b7b40= 8ee</span></a>>, several times, and am looking for more = resources.<o:p></o:p></p><p class=3DMsoPlainText>>>> = <o:p></o:p></p><p class=3DMsoPlainText>>>> = Taliesin<o:p></o:p></p><p class=3DMsoPlainText>>>> = ~.~.~<o:p></o:p></p><p class=3DMsoPlainText>>>> Also available = off list at: <a href=3D"mailto:[email protected]"><span = style=3D'color:windowtext;text-decoration:none'>[email protected]= du</span></a> Inclusive <o:p></o:p></p><p = class=3DMsoPlainText>>>> Design Researcher PhET Interactive = Simulations <o:p></o:p></p><p class=3DMsoPlainText>>>> <a = href=3D"https://phet.colorado.edu/en/accessibility"><span = style=3D'color:windowtext;text-decoration:none'>https://phet.colorado.edu= /en/accessibility</span></a><o:p></o:p></p><p = class=3DMsoPlainText>>>> Physics Department<o:p></o:p></p><p = class=3DMsoPlainText>>>> University of Colorado, = Boulder<o:p></o:p></p><p class=3DMsoPlainText>>>> = <o:p></o:p></p><p class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>>>> <o:p></o:p></p><p = class=3DMsoPlainText>> <o:p></o:p></p><p class=3DMsoPlainText>> = <o:p></o:p></p><p class=3DMsoPlainText>> <o:p></o:p></p><p = class=3DMsoPlainText><o:p> </o:p></p></div></body></html> ------=_NextPart_000_012F_01D61E0A.50C878F0--