RE: Label Association with Input Field Question

Mike, in my opinion you need an aria-label, aria-labelledby, label, or title for the input – having the search role on a parent element or a placeholder is not sufficient.

Jonathan

Jonathan Avila
Chief Accessibility Officer
SSB BART Group
jon.avila@ssbbartgroup.com<mailto:jon.avila@ssbbartgroup.com>
703.637.8957 (Office)
Visit us online: Website<http://www.ssbbartgroup.com/> | Twitter<https://twitter.com/SSBBARTGroup> | Facebook<https://www.facebook.com/ssbbartgroup> | Linkedin<https://www.linkedin.com/company/355266?trk=tyah> | Blog<http://www.ssbbartgroup.com/blog/>
Check out our Digital Accessibility Webinars!<http://www.ssbbartgroup.com/webinars/>

From: Mike Elledge [mailto:melledge@yahoo.com]
Sent: Tuesday, June 07, 2016 2:09 PM
To: WCAG WG
Subject: Label Association with Input Field Question

Hi All--

Is it compliant to use an aria role in place of a label for a search field?

This is the code:

  <form role="search" class="inLine search" >
    <input type="text" />
    <input type="submit" value="Search" />
  </form>

I want to identify search as a region, but avoid the redundancy of aria-label or a "search" label hidden off-screen. The submit button identifies the purpose visually, and screen readers announce it aurally.

I've considered adding a placeholder attribute, but the consensus is that it is not compliant since it doesn't create an association between the label and input field (even though it is reflected that way in the DOM).

What do you think, is this appropriate?

Thanks!

Mike