Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Questions regarding accessability and screen reader

    I have a customer who has a disability and is using a screen reader.

    He has had problems accessing some elements via the keyboard. Below are the issues he has reported.
    • As far as I can tell it is not possible to tab to the removeRecords button in a ListGrid. Is there another way to remove a record via the keyboard?
    • I have a listgrid with ExpansionMode.DETAILS and I can't find a way to open the details with the keyboard either. The customer wrote this: "The button in the row data cell that toggles expanding and collapsing is not presented in a way that makes this functionality apparent to screen reader users. There is no accessible communication of the fact that a row can be expanded. The expanded or collapsed is present, but not on a focusable element."
    • I can see from the HTML that a select item does not have an associated label ("for" tag). This is the same in the showcase where only some of the select items labels have "for" tags. Is this a bug or something by design?
    • It doesn't seem like the DatePicker widget has full keyboard control. I fond an old thread regarding this(http://forums.smartclient.com/forum/...yboard-control), but since it was quite old I just wanted to ask if this answer still holds.

    #2
    1. there's no standardized keyboard shortcut for this, but applications can add a keyboard shortcut via bodyKeyPress, or could have an external button or menu that provides the same function and is keyboard accessible

    2. we'll check on this one - there may be an ARIA way to advertise expandability. If not, here again we'd recommend an external button or menu.

    3. if there is a SelectItem that has not been given a title in the code for a given sample, then it cannot have a "for" tag. If you find an instance of a SelectItem where a title appears in the source code, but which does not have a "for" tag, please let us know

    4. yes, that answer still holds

    Comment


      #3
      A follow up on #2: We are adding the aria-expanded marker to expandable rows in ListGrids.
      Details on that property here:
      https://www.w3.org/WAI/GL/wiki/Using...psible_regions

      - FYI - This is a property we already apply to (for example) TreeGrid folder nodes to indicate expandability, and adding it for these expandable rows makes sense.

      Also we never answered your question about a keyboard shortcut to expand / collapse such rows. You can actually use the left/right arrow key for this (that's a built in shortcut) - but you could again also implement your own additional shortcut via bodyKeyPress if that makes sense within your application.

      A question for you so we know where to apply the fix: Which version of SmartClient are you using?

      Thanks
      Isomorphic Software

      Comment


        #4
        Another quick follow up on #2: We've now made a change to branches 11.1d, 11.0p and 10.1p to mark expandable rows as aria-expanded:true or false depending on their current expansion state.

        Regards
        Isomorphic Software

        Comment


          #5
          Thanks for the follow up.

          Regarding this:
          Originally posted by Isomorphic View Post
          3. if there is a SelectItem that has not been given a title in the code for a given sample, then it cannot have a "for" tag. If you find an instance of a SelectItem where a title appears in the source code, but which does not have a "for" tag, please let us know
          If you look at this sample: http://www.smartclient.com/smartgwt/...ntrols_various
          All the SelectItems have a title in the source code, but only some af them have a for tag in the html:
          Click image for larger version

Name:	missingForTags.png
Views:	49
Size:	112.6 KB
ID:	237506

          Comment


            #6
            Ah. <label for=> can only be used with native HTML inputs. Some of the controls you're looking at are ComboBoxItem controls, in which case there is a native "text" input. SelectItem doesn't have a native input element, just a DIV, so <label for=> cannot be used. However, there is a separate aria-label *attribute* which causes correct reading in this case.

            Comment

            Working...
            X