Stuck in drop down menu with screen reader

Feb 23, 2023

Hi,

The drop down menu activities should be accessible, but, when I test it with NVDA, I get stuck in the first drop down menu (navigation with arrows), impossible to get out of the component.

If I use Tab, I go directly to the second drop down menu, without hearing the corresponding text.

Am I missing something ?

Thanks.

9 Replies
Jose Tansengco

Hello Gregory, 

Thanks for reaching out!

I tested a sample drop-down interaction with NVDA active, and I can confirm that I was able to interact with it properly:

Since the behavior appears to be isolated to your project file, would you be willing to share a copy of your project file here or in private by opening a support case so we can take a closer look at what's happening? Please include which version of Storyline 360 and NVDA do you have installed. We'll delete your files when we're done testing!

Gregory Fauchille

Hi,

here is the file with only the activity.

Storyline 360 3.72.29699
NVDA 2044.4.0.27401

What append :

* hit the down arrow to navigate to the drop down menu
* hit the space bar to enter the drop down menu
* hit down arrow to select my answer, and be stuck, can't get out of
the drop down menu.
* If I hit Tab, I go directly to the new drop down menu without
hearing the propositon before.

Regards.

-- /Cordialement,/
///Grégory Fauchille

/
HDG Tél : 07 69 87 82 85
9, Allée du Littoral 22410 Tréveneuc
www.gregoryfauchille.fr

Eric Santos

Hi Gregory,

Thanks so much for sharing the Storyline project file! I published it to Review 360 and ran some tests using the latest versions of Google Chrome and NVDA. Here's a quick Peek recording of my results.

I navigated to the combo boxes using the Tab key, which jumps to the different interactive elements in the slide. Once in a combo box, I used the Up and Down arrow keys to navigate to the dropdown items. Please check out this article for details on keyboard navigation with a Screen reader:

If you see something different and repairing Storyline doesn't improve things, could I have you connect with us in a case so we can determine what's happening? We'll reach out soon after we hear from you!

Start a Support Case

Gregory Fauchille

Hi,

if you try to navigate the slide eyes closed, you will probably better understand the issue.

The problem is not to naviguate between the drop down menu with the tab bar, that works perfectly. The issue is to  hear all the text of the slide.

So you should navigate with the top and down arrow first, to listne to the slide title, then the txt "Grâce à la liste déroulante…", then the fist item : "La répartition globale doit tendre…" and finally get into the drop down menu. This part works perfectly.

But the issue comes here: once you are in the dropdown menu and have selected the option you want, you want to listen the second item, but the only way to get out othe drop down is to hit the tab button. But then you go directly to the seconde drop down menu, there is no way to listen the second item, so you don't know which option to choose because you don't know what is the propostion.

Regards.

-- /Cordialement,/
///Grégory Fauchille

/
HDG Tél : 07 69 87 82 85
9, Allée du Littoral 22410 Tréveneuc
www.gregoryfauchille.fr

Eric Santos

Hi Gregory,

That is an excellent point! When using a screen reader, learners use a combination of browse and focus modes.

Browse Mode: Used for reading. Learners use this (via down and up arrows) to navigate through all text and interactive objects on the slide.

Focus Mode: Used for user input. Learners use this (via Tab and Shift + Tab) to jump from one interactive object to another. This skips text and images.

To take advantage of these modes, here's the suggested keyboard workflow you and your learners can use:

  1. The down arrow should be used until the drop-down is reached (this is browse mode)
  2. Then use Enter or Spacebar to activate the selection (places screen reader in focus mode)
  3. Arrow up/down to hear selections
  4. Then Enter or Spacebar to select
  5. To get out of the drop-down, Insert + Spacebar (places screen reader back in browse mode) is the official keyboard shortcut; ESC can also work.
  6. Use the down arrow to navigate to the next textbox and hear the description for the next drop-down.

Also, your email signature came through when you replied via email. You can remove that by clicking Edit beneath your response. Here's a quick Peek video with the steps.

Let me know if that helps; I'll be more than happy to assist further as needed!