Interactive Video | Captions hidden by interactive elements (Web Accessibility Issue)

Submitted by Alex_DES on Thu, 01/16/2020 - 17:58
Forums: 
Bugs in content types

The captions track is hidden by interactions added to the videos (pop-up boxes) and causes a web accessiblity issue. Captions added to videos are intended to make the video and also make it more accessible to viewers who may suffer from hearing issues and others. 

The laywering might be an issue, since the player (the application that runs the video) is "under" the overlay of interactions added. However, it should be fairly easy to allow content creators to set the captions to appear under the video (instead of covering the lower portion of the video) or try an implement a more complex solution in which the player will display captions on top of any interaction on the screen (which may require to content creators to ensure that information isn't hidden). Alternatively, perhaps it would be possible to add a transcript of the captions (if added) below the video element (such as the ones available in LinkedIn Learning and other platforms).

The preference should be for the captions to be visible since they support the content (spoken words) that are the audio track. 

Detailed steps to reproduce the bug:

  1. Create an Interactive Video
  2. Add a captions/subtitles track (.vtt file)
  3. At a point where the captions are showing, add an interaction and position it over the placement of the captions track. The interaction can be a full screen (see Issue 03.png attached) or a partial screen (see Issue 01.png and Issue 02.png attached).
  4. The viewer will not be able to see the captions track.

Platform and version number:
This issuse manifests itself in all platforms.

Mobile or Desktop:
Both

Browser: 
Any, the issue is with the layering of the components of the Interactive Video, the captions track is "under" the interactions layer.

H5P plugin version:
Persistent since the element was added to H5P.

H5P content type and version (if a content type was used), and a sample URL or attached H5P.

Any browser console errors:
None

Any PHP errors:
None

Screenshots if it's a visual problem:
Attached (3 screenshots)

Attachments: 
Image icon Issue 01.png
Image icon Issue 02.png
Image icon Issue 03.png
Summary: 
Interactive Video | Captions hidden by interactive elements
Content types: 
Interactive Video
BV52's picture

BV52

Mon, 01/20/2020 - 18:19

Hi Alex_DES,

Thank you for reporting this. I created a bug report and you can follow the progress here.

-BV

Alex_DES

Mon, 02/03/2020 - 17:14

Thanks for opening the issue on JIRA, much appricated and hoping for a resolution on this one.

falcon's picture

falcon

Fri, 03/27/2020 - 15:38

Hi Alex,

Thank you for reporting. We normally put a very high priority on fixing accessibility issues, but I don't think we'll be doing anything about this one in the short term since it is up to the author to avoid covering parts of the video that shouldn't be covered. The subtitles are kind of part of the video the way we do it and can't be easily placed on top of the interactions. Also, for interactions that pauses the video, like tasks often do, you wouldn't want the subtitles on top. This is something you seem to be aware of, but we're not eager to make a system for deciding what subtitles goes on top of what interactions or opposite. I can see that there are many things you might want to do where it is irritating that the subtitles end up below interactions but the time it will take to do something about this is just too high, and I don't think I've seen anyone else doing anything like this either (except having the text outside the video as you mention, which we'll probably also support at some point)