TAB order not working

Feb 04, 2020

My latest course is behaving funny. I have text boxes on the screen however no matter what I do, I cannot get the tab to go the boxes. I have ensured that the Accessible check box is selected but yet using the tab key only goes to the buttons on the page. I have tried deleting the text boxes and retyping and still the same thing. Never had an issue with this in the past.

33 Replies
Lauren Connelly

Hello Mark and Nicole!

With the latest update to Storyline 360, which is  Build 3.36.21213.0, we've made some enhancements to accessibility.

You specifically mentioned Tab Order, so I wanted to share this documentation which explains it fully.

In short:

  1. Text and images are read immediately by screen readers so learners don’t have to press any keys to hear the slide content. These objects are read in the tab order you defined in Storyline.
  2. Use your screen reader's navigation keys (e.g., Down and Up arrow keys) to move through the objects on the slide.
Irfan Khan

Hi Lauren,

I am facing a similar issue where text box tab ordering is not working similar to Mark's problem. I am using the latest updates of the Storyline and am using NVDA as screen reader. Is there anything which is updated in Storyline which is causing this issue? Because I have few older published courses of January this year which work absolutely fine whereas if republish with the updated Storyline the same problem occurs.


Lauren Connelly

Hello Irfan!

I'm happy to lend a hand! In Storyline 360 Update 37 (Build 3.37.21453.0) released in February changed the tab order behavior. What you've found in previous versions is that you had to tab to every object on a screen. Now you will only need to tab to interactive objects such as data entry fields, graphics, videos, buttons, etc.

If this sounds different from what you're noticing, please let me know!

Irfan Khan

Hello Lauren,

Thanks for the update, in earlier versions we had the freedom of adjusting the tab order as well as alt-text for non interactive elements thereby giving us multiple solutions to provide for accessibility. I have few queries as follows:

  • In the current update, do the non-interactive elements readout themselves?
  • Does changing the tab-order will have any effect on reading order?
  • Earlier we could use ChromeVox to test the accessibility, now it seems it doesn't read the textboxes.

 

Thanks again for replying.

Lauren Connelly

Hi Irfan!

Great questions! I'll answer each question individually as you've asked them.

In Storyline 360, Update 38 (Build 3.38.21779.0) non-interactive elements will read out when you move through the slide using the keyboard.

Changing the Tab Order does affect the reading order as a user will move through the slide following the tab order.

Lastly, ChromeVox isn't currently supported so I'm not familiar with its behavior. Storyline 360 courses work with JAWS 16 and later, NVDA, VoiceOver, and TalkBack in our supported browsers.

Let me know if there is anything else that I can clarify!

Cathy Edwards

Hi Lauren,

I'm coming to this thread late, but was just upgraded to 360. I understand the screen reader being able to read text elements without the need for tabbing. Here's a question regarding tab order and a text/shape element. 

Recently, a non-sighted user asked me if there was a way he could skip a slide without having to tab through every element on screen. Granted this was the SL3 version, but I was curious and was wondering if I created a button using a shape and added the words "Skip Slide" in it, if that would work. So, with my SL360 version, I added a transparent button that has the words "Skip Slide" and placed it at the top of the tab order. Unfortunately, even though I placed it at the top of the tab order, I still have to tab through all of the other elements on the slide before I get to the transparent "Skip Slide" button I created. 

In the older SL version, this same user could not click any of the menu items to move past slides he'd already worked through. I'm wondering if the SL360 menu will allow him to navigate through to any slide? 

The courses I create are placed in an LMS created by Oracle if that makes a difference. 

Any help/suggestions would be great.

Ren Gomez

Hi Cathy,

With the accessible player in Storyline 360, the tab key now only focuses on interactive objects in the slide, presents the Skip Navigation shortcut, and then immediately jumps to the Next slide button on the player, drastically reducing the number of keystrokes needed to move to the next slide. 

It may be that you no longer need a "Skip Slide" button, and it's worth testing a sample project to get a feel for the accessible player. This comparison below provides some more detail on the differences before and after the player was implemented.

I recommend taking a look at this article, as well as the resources Lauren shared above. Let us know if you have any further questions!

Rebecca Harrington

Thankful to stumble upon this thread. I have a related concern in that scrollboxes are also not appearing in tab order. if this issue is mobility related and someone is utilizing tab/return to go through the course but is not using a screen reader, how do they complete the text in a scroll box if it never highlights?

Nilesh Vedpathak

Hi Ren,

I have embedded a web-object, in a Storyline file. The WebObject contains a image, buttons and text. This file was working well while published in Storyline 3 and in earlier version of 360. I could read all text image elements using JAWS reader. Now with the latest updates of SL 360, the published version is not able to read the web-object elements, and not I am not able to click on buttons in the web-object using space or enter key.

Please let us know if there is any special care needs to be taken while integrating the WEB-Object in latest updated version.

Ren Gomez

Hi Rebecca,

You might be on an older version of Storyline 360, as we fixed keyboard accessibility for scrolling panels in Update 41! This discussion below provides more insight:

Hi Nilesh,

I'd like to have our support engineers take a closer look at your web object setup and work with you one-on-one. Can you please submit a support case here?

Katie Riggio

Hi Peter,

I'd love to help investigate this behavior!

Check out this quick video demo of my test with a Storyline 3 Update 10 slide and JAWS version 2020.2004.66: The tab order defined controls the reading order of text for screen readers. I also used the Down and Up arrows to move through the text and interactive objects on the slide, listening to each item along the way.

For more info on the latest accessibility enhancements in Storyline 3, check out this resource: 

If your experience is different, are you comfortable with sharing the file for testing? You can use this upload link to share it privately.

Jeremy Stump

Katie, I have some questions in regards to the Tab order. We have question slides that become difficult for a user to understand when they only use the tab key. Since the tab key does not read the text it skips over the question itself and goes right to the answer options. If the user is using the tab key they would not have context on how to answer the question. Is this expected when using the tab key? Should a user only use the up and down arrow in keys in this case and never use the tab key? Is there anyway currently to make text elements also be accessed using the tab key?

Ren Gomez

Hi Jeremy,

That's correct; using the up and down arrow keys will allow the learner to scroll through the slide content in a question slide, including the text. Using the tab key will only scroll to interactive objects on the slide. This article on navigating multiple-choice slides shares the expected behavior:

There's no way to make all elements accessible using the tab key as it is tedious and not in line with how accessible learners are experiencing other web content. The article Katie shared above covers how navigation is utilized today by both screen-reader and keyboard-only users:

I hope this helps!

Leslie McKerchie

Hi John,

The Focus Order window controls the tab order of interactive objects, such as buttons and markers, and the reading order for non-interactive objects, such as text and images.

Storyline 360: Customizing the Focus Order of Slide Objects

It sounds like you've added a trigger, but you cannot access it via the keyboard? We would certainly want to take a look at that. Please share your project file publicly here or send it to me privately by uploading it here. I'll delete it when troubleshooting is complete.

Seth Merriam

Hi Leslie and Maria (recent staff to comment here). I appreciate that John is solving a problem and has gotten a support case going, but can one of you commit to sharing the resolution here? It would be helpful to know. I ask because in the past I have seen a few threads that stop with a "great you filed a case..." but it would have been helpful to hear of solutions :) 

Mateusz Szuter

I still have a problem with Webobjects.

I manually set them in Focus Order window as for example 3nd, right after title and some text. I'm using down key in NVDA to read through the screen and the order is as following:

1. Title
2. Some text #1
3. Here should be webobject with, I guess, its whole content. But instead, we jump straight to 4.
4. Some text #2
5. Some button #1
6. Here should be nothing, but instead, webobject is read. It reads like this "Frame, all the contents, end of frame".

You can export attached story and check for yourself.

Can this be fixed soon? It breaks my whole course flow.