How do I add labels to radio button sets for accessibility?
Mar 07, 2019
I am in the process of converting a drag and drop interaction to a series of radio button sets to make the interaction accessible.
I've named each button set according to the text label next to it, and I was hoping that the screen reader would say that name aloud for each button choice, but it just says radio button not checked (or checked, depending on the state).
Is there a way of explicitly attaching the text label to the button set?
Do you think having the tab order set up correctly is enough to make this accessible?
Are there better ways of converting drag and drop interactions so they are accessible for keyboard nav and vision impaired learners?
I am avoiding drop down menus until the problem with JAWS not reading the items in the drop-down list is fixed.
Thanks for your thoughts and suggestions!
6 Replies
Hi there, Karen. Try adding alternate text to the Normal state of your buttons:
Adding alternate text in the Tab Order window to the button won't adjust the Normal state text. We have that behavior documented. In the meantime, edit the Normal state with alt text and tell me if that does the trick!
That's brilliant Crystal, thanks so much! Exactly what I was hoping for.
Hi Crystal,
You gave such a great answer to my last question, so now I have a follow on.
I am creating a list of fields that require user input. I set up a table with 2 columns, one that has the numeric input label, and a column for numeric input. I inserted a numeric input field and named it the same as the label. I also added alternative text for the numeric input field.
When I preview the slide, the screen reader just says "edit" for the input field. Is there a way to make this more friendly for a screen reader? So that the user would definitely know which input field they are on?
Thank you!
Hi again, Karen! This is expected behavior. When you tab to the text entry field, it is actively in edit mode. In HTML5 output, the text entry will read aloud the letters as they're being inputted. If you tab back to the field after entering text, the screen reader will read that it "contains text," but not read what is in there because it is again in editing mode.
Is the screen reader reading the column before the entry fields? Does the tabbing bounce from the label column to the input column in the right order?
Hi Crystal,
Thanks for the speedy response!
Yes, it tabs in the correct order. I was just hoping that there was some way for the screen reader to read the alt text for the input field to tie it more closely to the label text in the previous column. I guess it will be obvious, but I'm not totally sure what is helpful and necessary so I thought I would ask in case there is a better way to do this.
Thank you.
Hello there, Karen!
I'm excited to share that we just released Update 34 for Storyline 360. It addresses the issue where JAWS did not read the alt text from Tab Order for objects with multiple states.
To see all the enhancements this version has to offer, follow these steps to update your software!
This discussion is closed. You can start a new discussion or contact Articulate Support.