WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: making search input field accessible without a <label>

for

From: Angela French
Date: Aug 24, 2015 3:23PM

Actually, I didn't realize/forgot there were two search fields on the page and so I was seeing the error for the other one. The fact that there are two search fields is another issue.

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Léonie Watson
Sent: Monday, August 24, 2015 2:12 PM
To: 'WebAIM Discussion List'
Subject: Re: [WebAIM] making search input field accessible without a <label>

> From: WebAIM-Forum On Behalf Of Angela French
> Sent: 24 August 2015 21:50
> I am trying to validate to WCAG 2.0 AA. I'm getting the error that I
> am missing an associated label on my search field.
>
> I have tried aria-label="search" and title="search" but neither one kept the
> error from being thrown. Are these not true solutions? Or must I have a
> <label> tag?

These are both valid techniques. Technique ARIA14 describes how to use aria-label to provide a label [1], and technique H65 describes how to use the title attribute [2].

The proviso (in both cases) being that the purpose of the field is apparent to sighted users based on context. The nearby search button being the visible cue in this situation.

Sounds like it might be worth filing a bug with the vendors of the checking tool you're using though?

HTH.
Léonie.
[1] http://www.w3.org/TR/WCAG20-TECHS/aria#ARIA14
[2] http://www.w3.org/TR/WCAG20-TECHS/H65.html