Re: html5-video keyboard controls

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> 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/
>> 
>> -----Original Message-----
>> From: Mandana Eibegger [mailto:mandana@schoener.at]
>> Sent: Tuesday, August 04, 2015 11:19 AM
>> To: Web Accessibility Initiative Interest Group <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), 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 08:30:20 UTC