Tab Order: Storyline skipping first object on non-base layers?

May 02, 2019

Ray Cole
By Ray Cole

I'm using Storyline 360 v3.26.18601.0 and am having a problem with the tab order.

It appears that when I open a layer from the base layer and hit the tab key, I do not go to the first object listed in my Tab Order panel for that new layer. Instead, Storyline skips the first thing listed in the tab order and goes to the second object in the list. I then have to tab through the entire rest of the page before I am cycled back, finally, to that first object.

Of course, this completely messes up the learner experience since I get to the Next or Continue button before I get to the main content on the page.

Here is a concrete example:

Main Storyline edit screen:

Storyline Edit screen, full

This is a screen from an emergency management course in a module on responding to an earthquake. It consists of a base layer called Drop Cover and Hold On and three feedback layers, one for each of the highlighted regions on the slide. Two are incorrect feedback layers (No: Boxes and No: Bottles) and one is the correct feedback layer (Yes: Good Choice).

Slide Layers

The idea is the learner clicks one of the highlighted regions, and in response, a trigger shows the feedback layer associated with that choice. If the learner clicks the correct place to drop, cover, and hold on, then the Yes: Good Choice layer displays:

Yes: Good Choice layer

This layer is set to Prevent the user from clicking on the base layer in its properties panel:

Layer Properties

This prevents objects on the base layer from being tabbed to while the learner is on this layer. Also, every object on this layer is hidden from the accessibility tools except for the feedback text box and the Continue button.

Here's my Tab Order panel for this slide:

Tab Order Panel

Here's a Peek video screencast of me trying to navigate through this page using the keyboard only (i.e., navigating with the Tab key and selecting with the Enter key):

Peek video of how this page behaves

The little teeter-totter video clip (meant to suggest the earthquake) at the start of the page  in question didn't get captured too well by Peek, but otherwise the video shows the tab behavior quite well. Why does it skip the feedback text box?

Is anyone else experiencing this or am doing something wrong?

Thanks!

    -Ray

 

 

48 Replies
Crystal Horn
almost 5 years ago05/03/19 at 7:39 pm (UTC)

Hi Ray. Your details really helped me understand what you're experiencing. This behavior matches a bug we have where on a layer, the yellow highlight is not around the first object in tab order. When pressing the tab key, the highlight appears around the second item. If you have a screen reader open, it will read the first item in tab order when the layer is opened.

We are investigating why this tabbing behavior changed. I'll add your discussion to our report so we can update you with changes. In the meantime, let me know if this workaround fits for your course: Add another invisible object to the layer and make it the first item in tab order.

Ray Cole
almost 5 years ago05/03/19 at 8:14 pm (UTC)

Hi Crystal, thanks for looking into this. I am reluctant to put an invisible and silent object first in the Tab order list because I would have to do it in so many places in this course. And then, what happens when the bug is fixed? I would have to go back and remove them all. 

However, if that is the only way at the moment, I may give it a try. Hopefully fixing this bug is a high priority for the Storyline developers!

I really do appreciate your quick and thoughtful reply. These forums are a very valuable part of the Articulate software suite.

Thanks!

    -Ray

Michael Griffin
almost 5 years ago05/21/19 at 1:41 pm (UTC)

I am also seeing this bug. I'm in Storyline 3 (Update 6). I have a series of question slides. After clicking Submit, the first two objects on the "Correct" and "Incorrect" layers are skipped in the tab order. Behavior is otherwise the same as above. Both objects have entrance animations. If I turn off those animations, only one of the objects is skipped in the tab order.

Aaron Fox
almost 5 years ago06/05/19 at 6:32 pm (UTC)

I am having this same issue. This sort of breaks any 508 compliance for a course, the solution of adding an object before the first item works for the first tab order but if you tab again there is now a random object in the tab order. So this doesn't work. Are there any other solutions for slide layers?

Katie Riggio
almost 5 years ago06/06/19 at 7:59 pm (UTC)

Hi, Aaron. I'm so sorry you've come across this issue!

While I don't have another workaround to share yet, we promise to keep this discussion updated as soon as new information is available. 

As we continue to investigate, our Support Engineers are also happy to help. Click here to start a conversation with the team. They'll do a deep dive on your file and let you know what they find!

Dayn Wilkins
almost 5 years ago07/10/19 at 10:48 am (UTC)

Hi.

I'm having a similar issue...

Tabbing works on the base layer, but then when I press Enter on an object to show a layer, the tabbing starts cycling through objects on the base layer again and I can't tab through content on the layer.

I've discovered that the default tab order puts the content of the layers first in the running order, and the content of the base layer last. Then I get the problem above. If however, I move the base layer objects to the top of the tab order list, I don't get this problem. But this creates a huge amount of work, when you have multiple layers with lots of content. Each base layer object has to be moved individually all the way to the top using the up arrow.

If this is needed to ensure layers tab correctly, why are the base layer objects not at the top of the tab order list by default? Is this by design, an oversight or a bug?

With thanks

Ray Cole
almost 5 years ago07/10/19 at 6:17 pm (UTC)

Dayn, if you go to each non-base layer in the Slide Layers panel and right click it, you'll see a checkmark labeled Prevent the user from clicking on the base layer.  Checking that checkbox will prevent anything on the base layer from being tabbed to from the other layers.

Prevent user from clicking on the base layer

Cheers!

    -Ray

Ray Cole
almost 5 years ago07/10/19 at 8:34 pm (UTC)

I agree that it's not ideal, but when I want learners to be able to click objects on the base layer, I've taken to just duplicating the clickable elements on the other layers where necessary. That way, when learners are on a non-base layer, they can tab to elements on that non-base layer and tab to the specific clickable elements copied from the base layer, but not to anything else on the base layer.

Cheers!

Dayn Wilkins
almost 5 years ago07/11/19 at 7:15 am (UTC)

Thanks again Ray.

That would be a solution. I can also solve it by manually changing the tab order, but either way is more work than it really should be.

I would still like to hear from Articulate staff on this, as it seems that it should just work, and a way to resolve it would be to change the default tab order to put the base layers objects first. Is this part of the bug mention above?

Ashley Terwilliger-Pollard
almost 5 years ago07/15/19 at 8:26 pm (UTC)

Hi Dayn,

Thanks for reaching out here and sharing all that detail. I know that our team is investigating a bug where the objects on a slide or feedback layer are listed first in tab order. 

I've linked this discussion to the report so once we have more info from our team we'll let you know here! 

Jessi Auslander-Crick
4 years ago01/23/20 at 12:36 am (UTC)

Hi, 

I don't know if a direct answer was ever given for this. But I use the tab order often, the solution that I found for this issue is to move the feedback in the tab order to where it would show. You have to tab extra through all those items because you have the feedback all the way at the top.

So in your scenario, you have the following tab order:

Yes - Text

Yes - Continue Button

No - Text

No - Continue Button

Slide - What should you do?

Option Yes

Option No

Option C

 

You would instead want this order:

Slide - What should you do?

Option Yes

Yes - Text

Yes - Continue Button

Option No

No - Text

No - Continue Button

Option C

C - Text

C - Continue Button

That keeps the feedback text as the first thing the user tabs to after selecting their answer. 

 

Does that make sense?

Chris Ansari
4 years ago01/23/20 at 3:35 pm (UTC)

I'd been adding an invisible tab item on my layers until I recently discovered a better solution:

Have the tabbable items on your layers not start at the beginning of the timeline. That's it.

I've been setting them to start at 0.01s (right-click object in timeline > Timing) and it has solved the problem. You risk a viewer seeing that 0.01s delay, but Clark Kent isn't taking my courses so I think I'm good.

Leslie McKerchie
4 years ago01/23/20 at 7:42 pm (UTC)

Hi everyone,

Thank you all for continuing to share the crucial need for creating accessible content for all learners. While more work remains, we're at a point where we're confident the job done so far delivers meaningful real-world improvements for learners with accessibility needs.

I've included links below where you can find all the details on what this means for Storyline 360 Update 36:

You'll also see our general FAQ on accessibility in Articulate 360 tools here.

This release makes it significantly easier for those users to perceive, operate, and understand content published with Storyline, while opening up more choices of the browser, assistive technology, and devices for the first time. Learners will benefit from the vast majority of these improvements, even when the course author is not designing their course for accessibility. 

If you have any questions or concerns, let us know here or reach out to our Support team. We know there is more to do, so we'll continue to keep you posted about future releases.

Sign In to Reply