Uploaded image for project: 'Grouper'
  1. Grouper
  2. GRP-1407

UI Accessibility Improvements: Placeholder text is not “visible” to a screenreader

    XMLWordPrintable

    Details

    • Type: Improvement
    • Status: Open
    • Priority: Major
    • Resolution: Unresolved
    • Affects Version/s: 2.3.0
    • Fix Version/s: 2.4.0, 2.3.0.patch
    • Component/s: UI
    • Labels:
    • Environment:
      Technology Used: NVDA (ver. 2016.1), Firefox (ver. 48.0.2) on Windows 10 PC

      Description

      Problem:
      Placeholder text is not “visible” to a screenreader
      Solution:
      This can be corrected by using the “aria-label” attribute. For this input field, the code would appear as:
      <input id="table-filter" class="span12" type="text" name="privilegeFilterText" placeholder="Entity name" aria-label="enter entity name">
      For a longer description the ARIA attribute "aria-describedby" could be used. See the example on page 7.
      Note: I found this area of the site confusing regarding the function of the filter and other options. You could also add text to an id associated with “aria-describedby” that explains how the options in this section operate.

        Smart Checklist

          Attachments

            Activity

              People

              Assignee:
              vivek.sachdeva@at.internet2.edu Vivek Sachdeva (google.com)
              Reporter:
              vivek.sachdeva@at.internet2.edu Vivek Sachdeva (google.com)
              Votes:
              0 Vote for this issue
              Watchers:
              2 Start watching this issue

                Dates

                Created:
                Updated: