508 & Accessibility Questions: Tabbing, Alt Text on unnecessary images, alt text on buttons and quiz answers.
Jan 12, 2018
Forgive me if these are answered elsewhere. I've been searching and haven't found quite what I'm looking for.
1. When viewing a course, you can use your Tab button to jump around to different buttons. In a plain jane browser, does this tabbing ONLY pick up things the user can interact with, OR does it approximate at all what a screen reader might pick up?
2. When adding alt text to items on slides, am I correct in saying we should only add alt text to necessary images/items and not purely decorative items? For example, many of our slides have images synced to the narration to make the slide more visually interesting but you don't NEED to see the images to learn the lesson. Since they are flying in and out, I dont see how a screen reader would be able to pick them up anyway. So, could we add an invisible rectangle on the slide with alt text saying something like "This slide has illustrative images synced to the narration." Just so they know what's up? And then focus on adding instructive alt text to things like buttons, visual items that are necessary for the understanding of the lesson, interactive elements, and the like?
3. On buttons, in the Alt Text, do we need to say "Button: Continue" or is the default text that says "Continue" sufficient? Same question, on quiz questions and the multiple choice answers, do we need to say like "Choice A: blah blah", "Choice B: blah blah", or is the auto-created alt text sufficient?
THANK YOU all in advance for your ideas! :)
(In case you're thinking "Why doesn't she have a list of requirements to follow?", our company creates stock training content that other companies can license, and in the last 8 years, we've had maybe 3 or 4 requests for 508 compliant material, so it's never been a priority. In those cases, we created audio-only versions of courses, and they took our quiz questions and built their own quizzes directly inside the LMS. BUT we're getting more questions about it now, and I'd like to try to make some of our content more accessible whenever possible.)
21 Replies
Lots of stuff here... let me see if I can summarize it a bit for you.
Tabbing - Almost every object you place in Storyline will show up on your tab list. Anything a user tabs to will get picked up by the screen reader. Key development note here: You CANNOT use Hotspots. For some reason they are not recognized by tabbing. Maybe one day....
Preview and make sure your tabbing order makes sense. For instance, we made a screen with 3 hot objects and popup layers of information for each. From left to right on the page, your tabbing order would pick up the first object, then its associated info layer, then object number 2, then its layer, and so on.
Alt Text - Its a good rule of thumb to add alt text to every object. If the object is purely decorative, then uncheck the accessibility box so it gets skipped over.
If you have a lot of animation going on you could try to put a hidden link on screen that describes it to your user. Be as descriptive as possible.
Narration - You need to include Closed Captioning unless the screen text matches exactly what the narrator is reading.
Buttons & Other Objects - The screen reader will recognize what object it is focused on and read its name to the user. So you do not need to add any extra object descriptions to your buttons. For images, be short and distinct. If you had a picture of a woman wearing a blue dress, use that description. Don't say, "Image of... or Photo of...", just call it like it is, Alt Tag = "Woman wearing a blue dress". Additionally, remove any file extensions from the file names when set the alt tags.
PDFs - If you have any PDF resources, those also need to pass an accessibility check all on their own. Adobe Acrobat does a pretty good job with it.
Good luck! Its always a challenge.
WOW thank you so much. This is super helpful, especially about what to include in the Alt Text.
Narration -- we always have the Notes match exactly what is being read and that's never been questioned. The interactivity of a course (like knowledge checks or slides that require you to click on multiple parts before moving on) is what triggers the few complaints.
Tabbing -- how do you control the tab order of stuff? (I've heard about the hotspots, and they've proven tricky in other regards so we tend to not use them in our development.)
Quizzing -- besides using simple multiple choice or multiple response questions, do you have any tips for making more accessible quizzes?
Hi there, Ashley! Check out this tutorial on customizing the tab order. I'll defer to the community for user-inspired tips on making accessible courses, but here are some resources we have as well:
I hope that helps!
THANKS!!!!!
Hi, I'd like to check something to make sure I understand. So for default objects like buttons and text boxes, we DO NOT need to add the alternate text? Is that correct?
The reason I'm asking is when I was playing around with tab order, those items (buttons and text boxes) have no alt text
But when I select each of those items individually on the slide and click Accessibility, they DO have alt text.
So DO they have default alt text built in or do they not?
Hi Ashley,
The greyed out text you're seeing in the "Accessibility" window of each object should be referencing the name of the object (or the text already on it).
Take a look at a basic rectangle, and you'll see it in a light grey "Rectangle 1". If you don't include text, the alt text will default to the name of the object on the timeline.
Hi Ashley. So even though we don't see any of that greyed out text in the "Tab Order Window," it *is* still present and will default to those things? My main concern would be for buttons and text boxes -- seeing the greyed out text in the individual accessibility windows was reassuring, but confusing to NOT see it when working with Tab Order.
Hi Ashley,
Standard text boxes and buttons with text should be read just as that, so I wouldn't worry about the alt text on those. You could add it in as a back up - but that could be a lot of extra work.
Have you tested any of your courses using a screen readers such as JAWS? It's a free download for the trial and that may at least help put your mind at ease for what things will/should work.
Hi there, This was a great thread, as I am still struggling with fully understanding the accessibility part. So my question is:
I have Audio with Closed captioning turned on.
A few slides are all images fading in and out based on the audio content, and I have the odd text box that fades in to emphasize that piece of content. How does a Screener work? Does it see the close captioning ( I used Storylines)...I do not have all the narration as text on the screen because the CC is automatically turned on, just a few pop ups...I have attached the Tab Order screen for one of the slides...and it obviously doesn't show as an item in this list.
Second, the Pics in the Tab Order window do not show text unless I have written in there, I filled in three as an example. But if I right click on an image for Badge ID Pic it shows in this example Scanning_card2.jpg so if I keep the picture and rename it in the Tab order window will it update it in the Alt Text window that I get when I right click on the picture...If I don't rename it in the Tab Order window is the Screener going to read Scanning_card2.jpg? If yes, how come the Tab Order for the Pics doesn't show the name that shows up when I right click on the image?
And general should I remove all pictures from a tab order if you have audio and closed captioning.
Thanks as always (I don't know what I would do without this forum) :) - Everyone, staff, hero's and peers all fantastic!!
You've got some great questions, Teresa!
If you have any more questions, please don't hesitate to reach out.
Thanks Ashley, I will take a look at your video. I also decided to submit an enhancement request, as there is a lot of time consuming work with Tab Order (no offense), and have some ideas (whether or not they are doable)...but just submitting it now.
Thanks, Teresa! We're continuously exploring new features, and customer input is extremely valuable in that process. I appreciate you sharing your feedback with us!
Thank you , I offered about seven suggestions, so even if they look at a few that would be great :)
HI Alyssa, now I have one more re: Tab Order, how does it work for Questions. I attached a screenshot of an example of one of my Multiple Response questions, the incorrect and correct popups show up first and then so on. I put words in the Alt Text field to describe to you what each row is. And do I assume however this works the Results slide would be similar as you have to put it in an order in the window showing both if you pass vs fail...right? Thanks for your patience...no rush on this one heading home for the day.
Hi Teresa,
Before adjusting the order of the objects in the Tab Order window, I would suggest previewing the slide and pressing the Tab key multiple times on your keyboard. If you find that the yellow focus box doesn't move in the order you'd like, you can make adjustments in the Tab Order window.
I can do that, but with regards to the right answer and wrong answer pop up window they both have to show in the Tab Order but how do you know which order to put it in?
Hi Teresa!
The order you have shown in the screenshot makes sense:
The learner won't see both the Incorrect and the Correct layer on any given slide, so it doesn't matter which layer objects are on top.
Perfect, thanks for putting up with me :)
Happy to help, Teresa! That's what we're here for. 🙂
One more tab question. With the question when I have a multiple response answer there is a yellow box that highlights all three, then the yellow box tabs through each one. Do I need the big box box for all three or should I remove that from the tab order? Thanks
Oh disregard, when I opened the tab order window, it doesn't show the full then the three separate it just shows the full...so I think that answers my question.
This discussion is closed. You can start a new discussion or contact Articulate Support.