Setting content focus on screen load

Sep 19, 2018

Hello everyone,

I have a screen reader/keyboard navigation question. 

I would like for the topmost piece of content (identified in custom tab order) to autofocus on slide/page load.  Right now when a slide/page loads, the user has to press <Tab> to navigate to a piece of content. I would like to automate this process and remove the initial need for the user to use <Tab>. Is there a way to accomplish this in Storyline 360?

A similar topic was addressed in an older post, however, I am not interested in text entry content specifically. 

Thank you for any help with this.

10 Replies
Ashley Terwilliger-Pollard

Hi Agnieszka, 

Are you looking for this to happen on every slide or only the first slide? 

I think you'd want to start by looking into the changes to skip player navigation, but keep in mind the screen readers are designed to access the browser elements as well. I haven't seen a way to skip through those, but I'll leave any other ideas to our accessibility experts in the community! 

Leslie McKerchie

Hi Seth,

Thanks for reaching out and following up. Are you looking for the arrows to provide navigation through your course? This should work if you have the trigger set to the object of the current slide.

Check out this sample attached and let me know if that's what you're looking for.

No interaction on slide needed and left and right arrows move through the content.

Seth Merriam

Thanks Leslie. I am actually NOT looking to navigate the entire course this way, at least not in this instance. Instead, there is an interaction on the screen that I am looking to allow learners to navigate with the arrow keys. So, the fact that the focus stays in the player, instead of the slide, seems to wreck it for me :/

Alyssa Gomez

Hi, Seth!

Are you using the player Next button to access the interaction slide?

If so, try adding a custom button to the previous slide. When the learner clicks the custom button, the focus will stay on the slide itself (not the player), and the learner should be able to use the arrow keys to interact on the next slide.

Let me know if that works for you! 

Seth Merriam

Hi Alyssa, thanks for the suggestion. This, however, would mean I have to remove the next button from the previous slide to ensure users clicked the custom one... and that goes against a best practice in my opinion, of always having the prev and next in the same location. Unless I am misunderstanding what you mean? 

I also just tried to trigger a click with jquery/javascript to click the "skip navigation" button, but not even that works for some reason :/

Alyssa Gomez

That's an excellent point, Seth. I would agree that it's best practice to have the user always click in the same location.

Instead of naming that custom button "Next", you could name it something like, "Click here to start interaction". Maybe that would make it stand out a bit more and differentiate it from the Next button? Just an idea. 😊

The community may have other thoughts, so I encourage them to chime in here!

Heather Pierorazio

I'm have a similar question regarding setting focus or somehow tab key press on screen load.  I'm making a simple version of the course totally for screen readers, have custom nav buttons on each slide so I'm not using the player.  As the original question posed "Right now when a slide/page loads, the user has to press <Tab> to navigate to a piece of content. I would like to automate this process and remove the initial need for the user to use <Tab> ".  I need to know how to do just that.  Any answers??  Did you find a work around Agnieszka?

This discussion is closed. You can start a new discussion or contact Articulate Support.