W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > July to September 2015

Re: html5-video keyboard controls

From: Michiel Bijl <michiel@agosto.nl>
Date: Wed, 5 Aug 2015 11:20:14 +0200
Cc: Mandana Eibegger <mandana@schoener.at>, "Gunderson, Jon R" <jongund@illinois.edu>, Web Accessibility Initiative Interest Group <w3c-wai-ig@w3.org>, "petri.1@osu.edu" <petri.1@osu.edu>, Terrill Thompson <tft@uw.edu>
Message-Id: <11972529-A598-4779-80A4-A526ED8FA160@agosto.nl>
To: Gijs Veyfeyken <gijs@anysurfer.be>
Hmm, that is weird, could have sworn it worked last time I checked. Anyhow, replied to the bug.

—Michiel

> On 05 Aug 2015, at 11:06, Gijs Veyfeyken <gijs@anysurfer.be> wrote:
> 
> I've tested Plyr and submitted some bugs. 
> Works well with Jaws and NVDA but the captions and mute checkbox are not read with VoiceOver.
> I can't find the cause. If you can, please comment on the bug:
> https://github.com/Selz/plyr/issues/103 <https://github.com/Selz/plyr/issues/103> 
> 
> Thanks,
> 
> Gijs
> 
>> On 05 Aug 2015, at 10:57, Michiel Bijl <michiel@agosto.nl <mailto:michiel@agosto.nl>> wrote:
>> 
>> This is another great one. Haven’t tested it extensively, but it handles keyboard/tab order support, and works with VoiceOver: http://plyr.io <http://plyr.io/>
>> 
>> —Michiel
>> 
>>> On 05 Aug 2015, at 10:29, Gijs Veyfeyken <gijs@anysurfer.be <mailto:gijs@anysurfer.be>> wrote:
>>> 
>>> This might be of interest to you:
>>> 
>>> Media Player Accessibility Comparisons
>>> https://docs.google.com/spreadsheets/d/1QJVcXx5hTWYBcJbHJD3DrL3hSFVbfy1VQFyADMtrDFY/edit?pli=1#gid=0 <https://docs.google.com/spreadsheets/d/1QJVcXx5hTWYBcJbHJD3DrL3hSFVbfy1VQFyADMtrDFY/edit?pli=1#gid=0> 
>>> 
>>> Kind regards,
>>> 
>>> Gijs
>>> 
>>>> On 04 Aug 2015, at 22:06, Mandana Eibegger <mandana@schoener.at <mailto:mandana@schoener.at>> wrote:
>>>> 
>>>> this is a great library - thanks for the link!
>>>> 
>>>> On 04/08/15 21:16, Gunderson, Jon R wrote:
>>>>> Here is one accessible video player library:
>>>>> http://ableplayer.github.io/ableplayer/ <http://ableplayer.github.io/ableplayer/>
>>>>> 
>>>>> -----Original Message-----
>>>>> From: Mandana Eibegger [mailto:mandana@schoener.at <mailto:mandana@schoener.at>]
>>>>> Sent: Tuesday, August 04, 2015 11:19 AM
>>>>> To: Web Accessibility Initiative Interest Group <w3c-wai-ig@w3.org <mailto:w3c-wai-ig@w3.org>>
>>>>> Subject: html5-video keyboard controls
>>>>> 
>>>>> Hi,
>>>>> 
>>>>> i am currently working on implementing custom video controls for html5-video and i am wondering how to make this accessible in the best way.
>>>>> i did search the internet, but i just couldn't find any specification to follow, so i thought maybe someone in this group could have some input/feedback ....
>>>>> 
>>>>> 
>>>>> *****
>>>>> ISSUE 1: proper markup
>>>>> 
>>>>> i was thinking of a basic structure like this
>>>>> 
>>>>> <div role="application">
>>>>>    <video id="my-video" ...>
>>>>>    <nav aria-controls="my-video">
>>>>>      <button ...>play [or pause - depending on the state]</button>
>>>>>      <button ...>some other function
>>>>>      etc. ...
>>>>> 
>>>>> does it make sense, to use the nav-element as a container for the controls? or would this be misleading?
>>>>> is the application-role appropriate for this case?
>>>>> 
>>>>> 
>>>>> ****
>>>>> ISSUE 2: tabbing
>>>>> 
>>>>> i think it is not a very good practice, if the user has to tab through
>>>>> all controls by default.
>>>>> 
>>>>> but if i do:
>>>>> - only the play-button can get focus via tabbing and
>>>>> - move between the controls with left-arrow & right-arrow key,
>>>>> i get a problem when using sliders to for instance control the volume or
>>>>> the current-time of the video, because following the WAI-ARIA best
>>>>> practices (http://www.w3.org/TR/wai-aria-practices/#slider <http://www.w3.org/TR/wai-aria-practices/#slider>), the
>>>>> arrow-keys control the value of the slider-widget.
>>>>> 
>>>>> an option to solve this issue, could maybe be to tab to the application and
>>>>> - the next tab would focus any next element outside of the application
>>>>> - use some key to enter the application.
>>>>> once the application is entered, the user can tab between the controls
>>>>> regularly.
>>>>> 
>>>>> would this procedure be understandable for the users? and if, would the
>>>>> enter-key be the appropriate key to use?
>>>>> 
>>>>> 
>>>>> ****
>>>>> ISSUE 3: keyboard-shortcuts for controlling the video-properties
>>>>> 
>>>>> once the application has focus, keyboard-shortcuts could be used to
>>>>> control the properties. for instance
>>>>> - use space bar for play/pause
>>>>> - use +/- to adjust the volume
>>>>> - page-up/page-down to jump to the end/beginning
>>>>> etc ...
>>>>> 
>>>>> which shortcuts should best be used?
>>>>> what about "mute" for instance? or jump to some point in time?
>>>>> 
>>>>> 
>>>>> 
>>>>> controlling the video should be usable without any help-descriptions.
>>>>> 
>>>>> i hope, someone finds this question interesting and worth discussing ...
>>>>> 
>>>>> thanks,
>>>>> mandana
>>>>> 
>>>>> 
>>>>> 
>>>> 
>>>> 
>>> 
>> 
> 
Received on Wednesday, 5 August 2015 09:20:55 UTC

This archive was generated by hypermail 2.3.1 : Tuesday, 13 October 2015 16:21:57 UTC