WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: A question about role slider and android TalkBack with chrome WebView

for

Number of posts in this thread: 6 (In chronological order)

From:
Date: Tue, Aug 13 2019 12:04AM
Subject: A question about role slider and android TalkBack with chrome WebView
No previous message | Next message →

Hi, I’m Hyongsop Kim from Korea and accessibility tester.
To test role slider, I referred wai-aria authoring practices slide example site.
Within this site, it is posble to use slider with keyboard with my screen reader with no problem.
By the way, with my android TalkBack with chrome WebView, TalkBack says it is slider and you can press volume button to set, but my volume button is not working.
By the way, within youtube mobile web with android chrome WebView, it is possible to use time adjustable slider with volume key.
Therefore I really wondering to let adjust slider with volume key for TalkBack users, what kind of script should I use.
Is it only working within accessibility object model?
But in case of youtube mobile web, my chrome is not canary, but I can adjust slider with volume key with TalkBack.
Please help me.
Thank you.

김형섭 / Hyongsop Kim
(주)엔비전스 / 웹접근성사업팀 팀장

서울시 종로구 가회동 1-29
1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996

http://dialogueinthedark.co.kr
http://cafe.naver.com/dialogueinthedark

From: Patrick H. Lauke
Date: Tue, Aug 13 2019 4:03AM
Subject: Re: A question about role slider and android TalkBack with chrome WebView
← Previous message | Next message →

many of the ARIA practices are primarily designed for desktop/keyboard. there’s a number of patterns that simply don’t work on touchscreen+AT scenarios https://www.w3.org/TR/wai-aria-practices-1.1/#mobile_and_touch_support / https://github.com/w3c/aria-practices/issues/8

Prime example is slider - it is simply not suitable for any touch scenarios, as AT on touch devices treats sliders like native sliders (where you CAN use volume keys to change the value on Android, or swipe up/down to change value on iOS) ... but the interaction is simply not possible to implement/detect with JavaScript for “faked” ARIA sliders.

https://patrickhlauke.github.io/aria/presentation/?full#155

For this reason, I’ve been strongly advocating NOT following the ARIA slider pattern unless you’re 100% sure only desktop/keyboard/AT users will use your site.

Instead, consider using a real <input type=“range”> which can be reasonably nicely styled with CSS. or, if you really must, use a “faked” slider (but WITHOUT any of the slider ARIA) and have a real range input in the background that actually gets interacted with - see https://codepen.io/patrickhlauke/pen/byWPMX (which is also - in a slightly expanded form - an example technique for WCAG 2.1 SC 2.5.1
https://www.w3.org/WAI/WCAG21/Techniques/general/G216)

P


> On 13 Aug 2019, at 07:04, 김형섭 < = EMAIL ADDRESS REMOVED = > wrote:
>
> Hi, I’m Hyongsop Kim from Korea and accessibility tester.
> To test role slider, I referred wai-aria authoring practices slide example site.
> Within this site, it is posble to use slider with keyboard with my screen reader with no problem.
> By the way, with my android TalkBack with chrome WebView, TalkBack says it is slider and you can press volume button to set, but my volume button is not working.
> By the way, within youtube mobile web with android chrome WebView, it is possible to use time adjustable slider with volume key.
> Therefore I really wondering to let adjust slider with volume key for TalkBack users, what kind of script should I use.
> Is it only working within accessibility object model?
> But in case of youtube mobile web, my chrome is not canary, but I can adjust slider with volume key with TalkBack.
> Please help me.
> Thank you.
>
> 김형섭 / Hyongsop Kim
> (주)엔비전스 / 웹접근성사업팀 팀장
>
> 서울시 종로구 가회동 1-29
> 1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
> T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996
>
> http://dialogueinthedark.co.kr
> http://cafe.naver.com/dialogueinthedark
>
> > > >

From: Patrick H. Lauke
Date: Tue, Aug 13 2019 4:08AM
Subject: Re: A question about role slider and android TalkBack with chrome WebView
← Previous message | Next message →

And in answer to the part about AOM: yes, the idea is that with AOM you’ll be able to also intercept volume keys/swipes (basically, the “intent” of the user to change the value) via JavaScript ... but as it’s far from ubiquitous, that’s not a sufficiently “accessibility supported” solution to tackle the problem and call it accessible. Sliders that fail to be operable this way arguable fail WCAG 2.1 2.5.1 currently.

P

> On 13 Aug 2019, at 11:03, Patrick H. Lauke < = EMAIL ADDRESS REMOVED = > wrote:
>
> many of the ARIA practices are primarily designed for desktop/keyboard. there’s a number of patterns that simply don’t work on touchscreen+AT scenarios https://www.w3.org/TR/wai-aria-practices-1.1/#mobile_and_touch_support / https://github.com/w3c/aria-practices/issues/8
>
> Prime example is slider - it is simply not suitable for any touch scenarios, as AT on touch devices treats sliders like native sliders (where you CAN use volume keys to change the value on Android, or swipe up/down to change value on iOS) ... but the interaction is simply not possible to implement/detect with JavaScript for “faked” ARIA sliders.
>
> https://patrickhlauke.github.io/aria/presentation/?full#155
>
> For this reason, I’ve been strongly advocating NOT following the ARIA slider pattern unless you’re 100% sure only desktop/keyboard/AT users will use your site.
>
> Instead, consider using a real <input type=“range”> which can be reasonably nicely styled with CSS. or, if you really must, use a “faked” slider (but WITHOUT any of the slider ARIA) and have a real range input in the background that actually gets interacted with - see https://codepen.io/patrickhlauke/pen/byWPMX (which is also - in a slightly expanded form - an example technique for WCAG 2.1 SC 2.5.1
> https://www.w3.org/WAI/WCAG21/Techniques/general/G216)
>
> P
>
>
>> On 13 Aug 2019, at 07:04, 김형섭 < = EMAIL ADDRESS REMOVED = > wrote:
>>
>> Hi, I’m Hyongsop Kim from Korea and accessibility tester.
>> To test role slider, I referred wai-aria authoring practices slide example site.
>> Within this site, it is posble to use slider with keyboard with my screen reader with no problem.
>> By the way, with my android TalkBack with chrome WebView, TalkBack says it is slider and you can press volume button to set, but my volume button is not working.
>> By the way, within youtube mobile web with android chrome WebView, it is possible to use time adjustable slider with volume key.
>> Therefore I really wondering to let adjust slider with volume key for TalkBack users, what kind of script should I use.
>> Is it only working within accessibility object model?
>> But in case of youtube mobile web, my chrome is not canary, but I can adjust slider with volume key with TalkBack.
>> Please help me.
>> Thank you.
>>
>> 김형섭 / Hyongsop Kim
>> (주)엔비전스 / 웹접근성사업팀 팀장
>>
>> 서울시 종로구 가회동 1-29
>> 1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
>> T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996
>>
>> http://dialogueinthedark.co.kr
>> http://cafe.naver.com/dialogueinthedark
>>
>> >> >> >> > > > >

From:
Date: Tue, Aug 13 2019 5:32AM
Subject: Re: A question about role slider and android TalkBack with chrome WebView
← Previous message | Next message →

Thank you very much for your answer.
My curiosity was solved coolly.
I will advise that use range in slider control.

Then may I ask you one last question?
It's actually not the Web, it's the Android native app accessibility issue.
It's about the slider, too.
In case of TalkBack, it read native slider as SeekBar with percent such as 20% or 60% and etc.
By the way, sometimes I want to remove percent value and add value text.
In case of html slider, there is a aria attribute that ValueText, which is each value’s own text.
But in case of native SeekBar, is there anyway to add custom ValueText like html?
I tested with contentDescription, but TalkBack reads percent value and contentDescription together.
But I don’t want to TalkBack read percent.
Could you help me?
For your reference, in case of youtube native app, there is a adjust time SeekBar, but TalkBack don’t read as percent attribute.
Thank you.

김형섭 / Hyongsop Kim
(주)엔비전스 / 웹접근성사업팀 팀장

서울시 종로구 가회동 1-29
1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996

http://dialogueinthedark.co.kr
http://cafe.naver.com/dialogueinthedark


-----Original Message-----
From: "Patrick H. Lauke"< = EMAIL ADDRESS REMOVED = >
To: "WebAIM Discussion List"< = EMAIL ADDRESS REMOVED = >;
Cc:
Sent: 2019-08-13 (화) 19:08:16 (GMT+09:00)
Subject: Re: [WebAIM] A question about role slider and android TalkBack with chrome WebView

And in answer to the part about AOM: yes, the idea is that with AOM you’ll be able to also intercept volume keys/swipes (basically, the “intent” of the user to change the value) via JavaScript ... but as it’s far from ubiquitous, that’s not a sufficiently “accessibility supported” solution to tackle the problem and call it accessible. Sliders that fail to be operable this way arguable fail WCAG 2.1 2.5.1 currently.

P

> On 13 Aug 2019, at 11:03, Patrick H. Lauke < = EMAIL ADDRESS REMOVED = > wrote:
>
> many of the ARIA practices are primarily designed for desktop/keyboard. there’s a number of patterns that simply don’t work on touchscreen+AT scenarios https://www.w3.org/TR/wai-aria-practices-1.1/#mobile_and_touch_support / https://github.com/w3c/aria-practices/issues/8
>
> Prime example is slider - it is simply not suitable for any touch scenarios, as AT on touch devices treats sliders like native sliders (where you CAN use volume keys to change the value on Android, or swipe up/down to change value on iOS) ... but the interaction is simply not possible to implement/detect with JavaScript for “faked” ARIA sliders.
>
> https://patrickhlauke.github.io/aria/presentation/?full#155
>
> For this reason, I’ve been strongly advocating NOT following the ARIA slider pattern unless you’re 100% sure only desktop/keyboard/AT users will use your site.
>
> Instead, consider using a real <input type=“range”> which can be reasonably nicely styled with CSS. or, if you really must, use a “faked” slider (but WITHOUT any of the slider ARIA) and have a real range input in the background that actually gets interacted with - see https://codepen.io/patrickhlauke/pen/byWPMX (which is also - in a slightly expanded form - an example technique for WCAG 2.1 SC 2.5.1
> https://www.w3.org/WAI/WCAG21/Techniques/general/G216)
>
> P
>
>
>> On 13 Aug 2019, at 07:04, 김형섭 < = EMAIL ADDRESS REMOVED = > wrote:
>>
>> Hi, I’m Hyongsop Kim from Korea and accessibility tester.
>> To test role slider, I referred wai-aria authoring practices slide example site.
>> Within this site, it is posble to use slider with keyboard with my screen reader with no problem.
>> By the way, with my android TalkBack with chrome WebView, TalkBack says it is slider and you can press volume button to set, but my volume button is not working.
>> By the way, within youtube mobile web with android chrome WebView, it is possible to use time adjustable slider with volume key.
>> Therefore I really wondering to let adjust slider with volume key for TalkBack users, what kind of script should I use.
>> Is it only working within accessibility object model?
>> But in case of youtube mobile web, my chrome is not canary, but I can adjust slider with volume key with TalkBack.
>> Please help me.
>> Thank you.
>>
>> 김형섭 / Hyongsop Kim
>> (주)엔비전스 / 웹접근성사업팀 팀장
>>
>> 서울시 종로구 가회동 1-29
>> 1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
>> T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996
>>
>> http://dialogueinthedark.co.kr
>> http://cafe.naver.com/dialogueinthedark
>>
>> >> >> >> > > > >

From: Patrick H. Lauke
Date: Tue, Aug 13 2019 7:12AM
Subject: Re: A question about role slider and android TalkBack with chrome WebView
← Previous message | Next message →

I’m afraid I’m not familiar enough with native development to answer the follow-up ...

> On 13 Aug 2019, at 12:32, 김형섭 < = EMAIL ADDRESS REMOVED = > wrote:
>
> Thank you very much for your answer.
> My curiosity was solved coolly.
> I will advise that use range in slider control.
>
> Then may I ask you one last question?
> It's actually not the Web, it's the Android native app accessibility issue.
> It's about the slider, too.
> In case of TalkBack, it read native slider as SeekBar with percent such as 20% or 60% and etc.
> By the way, sometimes I want to remove percent value and add value text.
> In case of html slider, there is a aria attribute that ValueText, which is each value’s own text.
> But in case of native SeekBar, is there anyway to add custom ValueText like html?
> I tested with contentDescription, but TalkBack reads percent value and contentDescription together.
> But I don’t want to TalkBack read percent.
> Could you help me?
> For your reference, in case of youtube native app, there is a adjust time SeekBar, but TalkBack don’t read as percent attribute.
> Thank you.
>
> 김형섭 / Hyongsop Kim
> (주)엔비전스 / 웹접근성사업팀 팀장
>
> 서울시 종로구 가회동 1-29
> 1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
> T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996
>
> http://dialogueinthedark.co.kr
> http://cafe.naver.com/dialogueinthedark
>
>
> -----Original Message-----
> From: "Patrick H. Lauke"< = EMAIL ADDRESS REMOVED = >
> To: "WebAIM Discussion List"< = EMAIL ADDRESS REMOVED = >;
> Cc:
> Sent: 2019-08-13 (화) 19:08:16 (GMT+09:00)
> Subject: Re: [WebAIM] A question about role slider and android TalkBack with chrome WebView
>
> And in answer to the part about AOM: yes, the idea is that with AOM you’ll be able to also intercept volume keys/swipes (basically, the “intent” of the user to change the value) via JavaScript ... but as it’s far from ubiquitous, that’s not a sufficiently “accessibility supported” solution to tackle the problem and call it accessible. Sliders that fail to be operable this way arguable fail WCAG 2.1 2.5.1 currently.
>
> P
>
>> On 13 Aug 2019, at 11:03, Patrick H. Lauke < = EMAIL ADDRESS REMOVED = > wrote:
>>
>> many of the ARIA practices are primarily designed for desktop/keyboard. there’s a number of patterns that simply don’t work on touchscreen+AT scenarios https://www.w3.org/TR/wai-aria-practices-1.1/#mobile_and_touch_support / https://github.com/w3c/aria-practices/issues/8
>>
>> Prime example is slider - it is simply not suitable for any touch scenarios, as AT on touch devices treats sliders like native sliders (where you CAN use volume keys to change the value on Android, or swipe up/down to change value on iOS) ... but the interaction is simply not possible to implement/detect with JavaScript for “faked” ARIA sliders.
>>
>> https://patrickhlauke.github.io/aria/presentation/?full#155
>>
>> For this reason, I’ve been strongly advocating NOT following the ARIA slider pattern unless you’re 100% sure only desktop/keyboard/AT users will use your site.
>>
>> Instead, consider using a real <input type=“range”> which can be reasonably nicely styled with CSS. or, if you really must, use a “faked” slider (but WITHOUT any of the slider ARIA) and have a real range input in the background that actually gets interacted with - see https://codepen.io/patrickhlauke/pen/byWPMX (which is also - in a slightly expanded form - an example technique for WCAG 2.1 SC 2.5.1
>> https://www.w3.org/WAI/WCAG21/Techniques/general/G216)
>>
>> P
>>
>>
>>> On 13 Aug 2019, at 07:04, 김형섭 < = EMAIL ADDRESS REMOVED = > wrote:
>>>
>>> Hi, I’m Hyongsop Kim from Korea and accessibility tester.
>>> To test role slider, I referred wai-aria authoring practices slide example site.
>>> Within this site, it is posble to use slider with keyboard with my screen reader with no problem.
>>> By the way, with my android TalkBack with chrome WebView, TalkBack says it is slider and you can press volume button to set, but my volume button is not working.
>>> By the way, within youtube mobile web with android chrome WebView, it is possible to use time adjustable slider with volume key.
>>> Therefore I really wondering to let adjust slider with volume key for TalkBack users, what kind of script should I use.
>>> Is it only working within accessibility object model?
>>> But in case of youtube mobile web, my chrome is not canary, but I can adjust slider with volume key with TalkBack.
>>> Please help me.
>>> Thank you.
>>>
>>> 김형섭 / Hyongsop Kim
>>> (주)엔비전스 / 웹접근성사업팀 팀장
>>>
>>> 서울시 종로구 가회동 1-29
>>> 1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
>>> T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996
>>>
>>> http://dialogueinthedark.co.kr
>>> http://cafe.naver.com/dialogueinthedark
>>>
>>> >>> >>> >>> >> >> >> >> >
> > > > > > > >

From:
Date: Tue, Aug 13 2019 6:52PM
Subject: Re: A question about role slider and android TalkBack with chrome WebView
← Previous message | No next message

No problem.
Your first email gave me a lot of help.
In addition, is there anybody to help me regarding android development accessibility issue based on my last email?
Thank you.

김형섭 / Hyongsop Kim
(주)엔비전스 / 웹접근성사업팀 팀장

서울시 종로구 가회동 1-29
1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996

http://dialogueinthedark.co.kr
http://cafe.naver.com/dialogueinthedark


-----Original Message-----
From: "Patrick H. Lauke"< = EMAIL ADDRESS REMOVED = >
To: "WebAIM Discussion List"< = EMAIL ADDRESS REMOVED = >;
Cc:
Sent: 2019-08-13 (화) 22:12:25 (GMT+09:00)
Subject: Re: [WebAIM] A question about role slider and android TalkBack with chrome WebView

I’m afraid I’m not familiar enough with native development to answer the follow-up ...

> On 13 Aug 2019, at 12:32, 김형섭 < = EMAIL ADDRESS REMOVED = > wrote:
>
> Thank you very much for your answer.
> My curiosity was solved coolly.
> I will advise that use range in slider control.
>
> Then may I ask you one last question?
> It's actually not the Web, it's the Android native app accessibility issue.
> It's about the slider, too.
> In case of TalkBack, it read native slider as SeekBar with percent such as 20% or 60% and etc.
> By the way, sometimes I want to remove percent value and add value text.
> In case of html slider, there is a aria attribute that ValueText, which is each value’s own text.
> But in case of native SeekBar, is there anyway to add custom ValueText like html?
> I tested with contentDescription, but TalkBack reads percent value and contentDescription together.
> But I don’t want to TalkBack read percent.
> Could you help me?
> For your reference, in case of youtube native app, there is a adjust time SeekBar, but TalkBack don’t read as percent attribute.
> Thank you.
>
> 김형섭 / Hyongsop Kim
> (주)엔비전스 / 웹접근성사업팀 팀장
>
> 서울시 종로구 가회동 1-29
> 1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
> T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996
>
> http://dialogueinthedark.co.kr
> http://cafe.naver.com/dialogueinthedark
>
>
> -----Original Message-----
> From: "Patrick H. Lauke"< = EMAIL ADDRESS REMOVED = >
> To: "WebAIM Discussion List"< = EMAIL ADDRESS REMOVED = >;
> Cc:
> Sent: 2019-08-13 (화) 19:08:16 (GMT+09:00)
> Subject: Re: [WebAIM] A question about role slider and android TalkBack with chrome WebView
>
> And in answer to the part about AOM: yes, the idea is that with AOM you’ll be able to also intercept volume keys/swipes (basically, the “intent” of the user to change the value) via JavaScript ... but as it’s far from ubiquitous, that’s not a sufficiently “accessibility supported” solution to tackle the problem and call it accessible. Sliders that fail to be operable this way arguable fail WCAG 2.1 2.5.1 currently.
>
> P
>
>> On 13 Aug 2019, at 11:03, Patrick H. Lauke < = EMAIL ADDRESS REMOVED = > wrote:
>>
>> many of the ARIA practices are primarily designed for desktop/keyboard. there’s a number of patterns that simply don’t work on touchscreen+AT scenarios https://www.w3.org/TR/wai-aria-practices-1.1/#mobile_and_touch_support / https://github.com/w3c/aria-practices/issues/8
>>
>> Prime example is slider - it is simply not suitable for any touch scenarios, as AT on touch devices treats sliders like native sliders (where you CAN use volume keys to change the value on Android, or swipe up/down to change value on iOS) ... but the interaction is simply not possible to implement/detect with JavaScript for “faked” ARIA sliders.
>>
>> https://patrickhlauke.github.io/aria/presentation/?full#155
>>
>> For this reason, I’ve been strongly advocating NOT following the ARIA slider pattern unless you’re 100% sure only desktop/keyboard/AT users will use your site.
>>
>> Instead, consider using a real <input type=“range”> which can be reasonably nicely styled with CSS. or, if you really must, use a “faked” slider (but WITHOUT any of the slider ARIA) and have a real range input in the background that actually gets interacted with - see https://codepen.io/patrickhlauke/pen/byWPMX (which is also - in a slightly expanded form - an example technique for WCAG 2.1 SC 2.5.1
>> https://www.w3.org/WAI/WCAG21/Techniques/general/G216)
>>
>> P
>>
>>
>>> On 13 Aug 2019, at 07:04, 김형섭 < = EMAIL ADDRESS REMOVED = > wrote:
>>>
>>> Hi, I’m Hyongsop Kim from Korea and accessibility tester.
>>> To test role slider, I referred wai-aria authoring practices slide example site.
>>> Within this site, it is posble to use slider with keyboard with my screen reader with no problem.
>>> By the way, with my android TalkBack with chrome WebView, TalkBack says it is slider and you can press volume button to set, but my volume button is not working.
>>> By the way, within youtube mobile web with android chrome WebView, it is possible to use time adjustable slider with volume key.
>>> Therefore I really wondering to let adjust slider with volume key for TalkBack users, what kind of script should I use.
>>> Is it only working within accessibility object model?
>>> But in case of youtube mobile web, my chrome is not canary, but I can adjust slider with volume key with TalkBack.
>>> Please help me.
>>> Thank you.
>>>
>>> 김형섭 / Hyongsop Kim
>>> (주)엔비전스 / 웹접근성사업팀 팀장
>>>
>>> 서울시 종로구 가회동 1-29
>>> 1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
>>> T. +82 2 313 9977 F. +82 2 313 3645 M. +82 10 3316 5996
>>>
>>> http://dialogueinthedark.co.kr
>>> http://cafe.naver.com/dialogueinthedark
>>>
>>> >>> >>> >>> >> >> >> >> >
> > > > > > > >