Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-18851

Accessibility: Notifications settings using Radio Buttons in Preferences Tool are not explicitly labeled.




      The radio buttons' text labels are wrapped with label tags, but there is a problem with the technique used for labeling the radio buttons. Unfortunately, the implicit labeling technique (simply nesting the input control inside of the label element) does not work in IE for radio buttons or checkboxes. For adaptive technology to find the label in IE, the explicit labeling technique must be used. This requires having the "for" attribute in the label element set to the ID of the input control that it is meant to label.

      Is it possible to use the explicit labeling technique with this tool's rendering/scripting technology?

      Example Implicit Label:
      <label><input type="radio" checked name="options_form:_id35" value="3"> Send me each notification separately</input></label>

      Example as Explicit Label:
      <label for="id35"><input type="radio" checked name="options_form:_id35" id="id35" value="3"> Send me each notification separately</input></label>

      For more information, please see WCAG 2.0 Technique: H44: Using label elements to associate text labels with form controls

      An example screen shot of what the JAWS screen reader presents to users for this tool is attached. Notice that all it presents for the preferences are a list of radio buttons and that they are either checked or not checked. Since it doesn't list a label with each control, It isn't clear to the JAWS user which radio button goes with which label since JAWS doesn't read the implicit label elements.

        Gliffy Diagrams


            Issue Links



                • Assignee:
                  noahbotimer Noah Botimer
                  brichwin Brian Richwine
                • Votes:
                  0 Vote for this issue
                  0 Start watching this issue


                  • Created:

                    Git Source Code