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

Accessibility: Subject input[type=text] box is not explicitly labeled for assistive technology users

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Verified
    • Priority: Critical
    • Resolution: Fixed
    • Affects Version/s: 2.8.0
    • Fix Version/s: 10.0
    • Component/s: Mailsender
    • Labels:
    • Environment:
      trunk + experimental on HSQLDB - Built: 06/16/12 02:30 - Sakai Revision: 109327 (Kernel 1.4.0-SNAPSHOT)- Server sakai-nightly.uits.iupui.edu

    • 2.9 Status:
      Merge
    • Previous Issue Keys:
      MSND-69

      Description

      The subject input text box is not explicitly tied to the "Subject:" text. Screen-reading technologies will have to guess as to which text to associate with this control and may guess incorrectly or simply report that the control is unlabeled.

      GENERAL RECOMMENDATION:
      Always explicitly label form input text controls with either a label element or by placing the label text in the title attribute of the input element.

      SUGGESTED FIX

      Change the code so this:

      <div class="section">
      <div class="headerkeyholder">
      <span class="headerkey">Subject:</span>
      </div>
      <div class="headervalue">
      <input type="text" class="fullwidth" value="" name="subject"><input type="hidden" value="istring#

      {emailBean.newEmail.subject}" name="subject-fossil">
      </div>
      </div>

      Renders as:

      <div class="section">
      <div class="headerkeyholder">
      <span class="headerkey"><label for="subject">Subject:</label></span>
      </div>
      <div class="headervalue">
      <input type="text" class="fullwidth" value="" id="subject" name="subject"><input type="hidden" value="istring#{emailBean.newEmail.subject}

      " name="subject-fossil">
      </div>
      </div>

      NOTES: Please notice the additional label element with the FOR attribute that points to the ID or the input control it labels. Also note the additional ID attribute that has been placed on the input element.

        Gliffy Diagrams

          Zeplin

            Attachments

              Activity

                People

                Assignee:
                maintenanceteam Core Team
                Reporter:
                brichwin Brian Richwine
                Votes:
                0 Vote for this issue
                Watchers:
                3 Start watching this issue

                  Dates

                  Created:
                  Updated:
                  Resolved:

                    Git Integration