Forum Discussion
iFrame video becoming a keyboard trap
We have several Rise tutorials that use YouTube content embedded using iFrames. Doing accessibility testing, we recently discovered that these become keyboard traps. Users can tab into the content and play it, but the standard guidance of using esc to navigate out of the video isn't working and tabbing through also doesn't seem to work. Does anyone have insight into what we need to do to make this content fully keyboard accessible? Has anyone else had this issue? Thanks!
6 Replies
Currently having exactly the same issue. I have tried using youtube URL and using the youtube embed code as well and its just getting stuck in a loop.
I tested using the direct link from YouTube as well and the issue was the same. For reasons of working with Blackboard we were using the iframe.
Hi MettaLash & CallumHaskins,
Sorry to hear that you're struggling with keyboard navigation in Rise.
With Rise course playback, the Esc key is typically used for canceling an action or closing an object. Such as a dialog window, menu, or ToolTip. Learners should be able to progress through a Rise Lesson containing embedded videos solely with the Tab key.
The experience may feel like a "keyboard trap" with interactive elements such as embedded YouTube videos. However, when testing, I found that YouTube videos also display a collapsed menu of "More videos" at the bottom of the player.
Those hidden items are still receiving keyboard focus. Learners are forced to progress through all of them before they can move on to other content within Rise itself. Unfortunately, there is no setting in Rise to override that behavior coming from 3rd-party video hosting platforms.
If you're comfortable sharing the embed links you've been working with, we're happy to investigate further. Feel free to provide those here in the discussion or privately in a support case.
Hi StevenBenassi thanks for the reply. I will log a support case with the issue.
I have just revisited this and can see that if you 'tab' a further 37 times after a visible key board selection on the video it then shifts the keyboard focus out of the video player.
I appreciate its a tricky one but would this be classed as a closed loop as i think most users would assumer after 5 tabs that the navigation loop was broken. Is this something that is being worked on to counter this?
I just want to understand this, as if that is the case then it would mean embedding video's would no longer be a viable option if its not accessible under the WCAG regulations.What you’re seeing is coming from the YouTube player itself, not something Rise can control. The keyboard behavior and tab order are built into the embedded player.
One small improvement you can make is to limit the number of suggested videos (which reduces extra tab stops at the end). You can do that by adding a parameter to your embed:
<iframe src="https://www.youtube.com/embed/[yourvideo]?rel=0"></iframe>
This keeps suggested videos within the same channel, which can help simplify navigation a bit.
