Explore the community Forums Lectora Inspire Tools Questions & Answers How to Change HTML name for Objects

Viewing 12 posts - 16 through 27 (of 27 total)
  • Author
    Posts
  • #420090 Score: 0
    Profile photo of Math Notermans
    Math Notermans
    Member
    contributor
    intermediate
    advanced
    friend finder
    junior moderator
    advocate
    LUC16 Attendee
    LUC16
    wise owl
    curious george
    115 pts
    @mnotermans5114

    To get the best 508 tips and advice… search for posts from Jason Dalrymple ( https://community.trivantis.com/members/jasonadal/ ) He for sure works most with accessibility of all users around here and i do think around his posts and questions you will find the best tips on 508…

    Kind regards,
    Math

    #420154 Score: 0
    Profile photo of Therese Michael
    Therese Michael
    Member
    beginner
    intermediate
    curious george
    wise owl
    friend finder
    contributor
    @tmichael9734

    Thank Tea, Darrel and Matt (on the other post) for the time you gave to resolve my issues.  Darrel: no apologies. When I didn’t find your jQuery, I used the one that was attached in your early post.  Perhaps this was the cause of the blank page.  I’ll try the one you sent me yesterday and will come back to you.

    Tea, if I check “initially hidden” property for the button that I want to hide from the screen reader, will that hide the button from the devices? If it works, I can check “initially hidden” and “show” the button when the page loads.  What do you think?

    #420170 Score: 0
    Profile photo of Therese Michael
    Therese Michael
    Member
    beginner
    intermediate
    curious george
    wise owl
    friend finder
    contributor
    @tmichael9734

    Darrel,

    Thank you much, your formula worked perfectly and the button was hidden. However, it was hidden totally from the screen. I was trying to hide it only from screen readers.  So far, I can’t figure it out, but I’m glad I learned your formula, thank you.

    #420172 Score: 0
    Profile photo of Joe Wieloch
    Joe Wieloch
    Moderator
    beginner
    intermediate
    friend finder
    contributor
    LUC16 Attendee
    verified member
    wise owl
    LUC17 Attendee
    advanced
    picture perfect
    48 pts
    @wheels

    Therese,

    That is a great idea! The button would not be read if it is initially hidden and then shown via an action. You may need a short delay on this show action, maybe add a 0.5 second delay.

    In the future this will not be the case, so make sure you set the “Empty ALT Tag” property. Later this year the screen readers will read text, buttons, images, etc that are shown via actions (if they don’t have the “Empty ALT Tag” property set). Screen readers will read the shown text because we are changing our code to notify screen readers when this happens, it will be in the next release.

    If there is some problem and you want to follow Darrel’s excellent aria-hidden advice you can do that without jQuery. Just attach an On Page Show action to the button that does a Run JavaScript action with this JavaScript:

    %HTMLNAME%.div.setAttribute(‘aria-hidden’,’true’);

    See screenshot.

    – Joe

    • This reply was modified 2 months, 1 week ago by Profile photo of Joe Wieloch Joe Wieloch.
    Attachments:
    #420175 Score: 0
    Profile photo of Darrel Somoza
    Darrel Somoza
    Member
    contributor
    friend finder
    beginner
    intermediate
    junior moderator
    advanced
    wise owl
    curious george
    profile
    195 pts
    @Klaatu

    Therese, are you sure you do not also have the initially hidden option selected. I know you are trying a lot of different things. The aria-hidden attribute should only hide the button from screen readers. Joe, above, is talking about token replacement, another great idea.

    #420180 Score: 0
    Profile photo of Therese Michael
    Therese Michael
    Member
    beginner
    intermediate
    curious george
    wise owl
    friend finder
    contributor
    @tmichael9734

    Joe, thanks a lot for the new method.  I removed the JQuery and used your JS on the button, however, it gave me a blank page.  Quick clarification, later in the year, will the readers completely skip the buttons that has “Empty ALT tag” set; or will they read the HTML name as it’s currently happening?

    Darrel: My bad, thanks a lot, you’re right! I’d “initially hidden” set.  Now that I unchecked it, yes, I can see the button.

    I’ll send the project to the 508 team and we’ll see if it works fine with them.  I’ll come back to you.

    #421054 Score: 0
    Profile photo of Therese Michael
    Therese Michael
    Member
    beginner
    intermediate
    curious george
    wise owl
    friend finder
    contributor
    @tmichael9734

    Hi Everyone,

    I promised to come back to the forum with the results of testing the formula you kindly provided to hide the elements from the AT devices.  Unfortunately, the devices are still reading the hidden elements even when I used “initially hidden”.  I also tried Darrel’s JS with no luck.

    I flipped all what I have done and now I showed all the buttons.  However, the 508 team is telling me that the buttons’ names are missing.  They can detect the “html123” name only.  I already have names for all buttons.

    Lectora Team: is there a way to allow users to change the html name at their end?

    Any advice?

     

    #421059 Score: 0
    Profile photo of Tim K
    Tim K
    Member
    contributor
    beginner
    intermediate
    advanced
    friend finder
    junior moderator
    advocate
    wise owl
    curious george
    Group Member
    293 pts
    @timk

    You should be aware that the html name is a quite important thing in the published output, as it makes the id of the <div> the button is in. Changing it would make the button loose a selection of CSS rules that are defined for the id / html name, e.g. its position on the page.

    Apart from that the id can easily be changed with javascript. But there’s no way to let the user change it.

    #421062 Score: 0
    Profile photo of Therese Michael
    Therese Michael
    Member
    beginner
    intermediate
    curious george
    wise owl
    friend finder
    contributor
    @tmichael9734

    Thank you Tim. I attached here the message I got from our 508 team on the buttons name, they want me to change the aria label in the code. How do I do that then?

    Attachments:
    #421090 Score: 0
    Profile photo of Tim K
    Tim K
    Member
    contributor
    beginner
    intermediate
    advanced
    friend finder
    junior moderator
    advocate
    wise owl
    curious george
    Group Member
    293 pts
    @timk

    I’ll combine some of the ideas from the other posts. Add an action to the button:

    On: Page show
    Action: Run javascript
    Javascript:

    getDisplayDocument().getElementById("%HTMLNAME%btn").setAttribute("aria-label", "Enter your Text for the aria-label");

    This way the aria-label is added to the <button> element. It worked in my test both Seamless and not. This action is copiable to each button, there should be no need to change anything, but the actual text in “Enter your Text…”

    #424890 Score: 0
    Profile photo of Laura Silver
    Laura Silver
    Moderator
    junior moderator
    verified member
    beginner
    intermediate
    contributor
    wise owl
    friend finder
    advanced
    curious george
    Group Member
    21 pts
    @lsilver

    @tmichael9734 – You had mentioned in an earlier post that the reason you wanted to hide the buttons in the first place is because they were showing initially hidden objects that would not be read by a screen reader. As Joe mentioned in a previous reply, Lectora 18.1 was just released and now screen readers will in fact be able to recognize and announce objects that were initially hidden, when they are shown. This is a great advancement to Lectora’s ability to support more interactive accessible content. Perhaps this new feature will help you out with the button issues you’re experiencing as they won’t be so necessary any longer? Let us know.

    #424920 Score: 0
    Profile photo of Therese Michael
    Therese Michael
    Member
    beginner
    intermediate
    curious george
    wise owl
    friend finder
    contributor
    @tmichael9734

    Thank you Laura, I really appreciate your, Joe’s and the entire community’s help with this.  I actually have Lectora 18.0 and I found that the screen reader still read the hidden buttons.  I may need to update it today, thanks for alerting me.  However, when I tested the project on Lectora 17.1.8, I found that the screen reader still read the initially hidden text when they’re displayed.  Was the new code in 17.1.8 too?  Anyway, you’re right, this is a great feature and will save me the time to duplicate and hide the text for the diverse users.

    The second issue that you may wish to address is the SCORM published version of the title works perfectly well if LMS is played on IE 11.7xx (any later version more than 11.2xxx).  Any version less than IE11.7xx  doesn’t run it well.  I’m not sure if you’re aware of this.

    Thank you again and thanks for the great Trivantis team and community,

Viewing 12 posts - 16 through 27 (of 27 total)

You must be logged in to reply to this topic.