WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Form elements

for

From: joe@a11yeval.com
Date: Mar 21, 2019 6:14AM


A.
<label>
The <input type="text value="___" /> has black and white stripes.
</label>

A above (label wrapping) does not work with all AT & browser combinations, I
would recommend the following modifications for this one, but would
recommend B over A

A. (modified)
<label for="blank">
The <input id="blank" type="text value="___" /> has black and white stripes.
</label>

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
Fischer, Johannes
Sent: Thursday, March 21, 2019 3:18 AM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Form elements

Hi,

I would also say that aria-describedby is not a label as the term "label" is
not inside the attribute name like in aria-label or aria-labelledby. Instead
it gives a description additionally to a label. Success criterion 3.3.2
would fail. But I think, criterion 4.1.2 would not fail as aria-describedby
is considered in the accessible name computation (no. 2, no. 2, second
bullet for example): https://www.w3.org/TR/accname/#terminology


Khoa, for your scenario 1 my thoughts for a solution would be:

A.
<label>
The <input type="text value="___" /> has black and white stripes.
</label>

B.
<span id="text1">The</span> <input id="gap" type="text value="___"
aria-labelledby="text1 gap text2" /> <span id="text2">has black and white
stripes.</span>

Johannes

-----Ursprüngliche Nachricht-----
Von: WebAIM-Forum [mailto: <EMAIL REMOVED> ] Im Auftrag
von Mohith BP
Gesendet: Donnerstag, 21. März 2019 05:39
An: WebAIM Discussion List
Betreff: Re: [WebAIM] Form elements

Hi,

No, aria-describedby cannot be the substitute for the accessible label as
mentioned by Birkir. However, using title attribute will not give same
experience across the assistive technologies on all platform. It is
recommended that the title alone cannot be considered as accessible label.

Thanks & Regards,
Mohith B. P.

On 3/21/19, Khoa Pham < <EMAIL REMOVED> > wrote:
> In scenarios where an input text field is embedded in the question
> sentence, such as fill in the blank, or is at the end of a question.
> What would be recommended as a label for the first embedded scenario
> and the scenario where an answer required after a question, examples
below.
>
> Scenario 1:
> The ___ has black and white stripes.
>
> Scenario 2:
> What color is a turtle? ____
>
> How would you recommend these be label and which html or aria element
> would be best for them?
>
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Birkir R. Gunnarsson
> Sent: Wednesday, March 20, 2019 3:51 PM
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: Re: [WebAIM] Form elements
>
> It still requires a label.
> A label, aria-label or aria-labelledby (as well as the title
> attribute) translate to the element's "accessible name".
> The contents of elements referenced with aria-describedby however map
> to the element's "accessible description".
> Assistive technologies know that the accessible name is not optional,
> it should always be displayed or announced when the element receives
> focus. The accessible description, however, is a bit optional,
> configurable and, in some situations, may not even be announced at all.
> An interactive element must always have an accessible name, but does
> not always need an accessible description unless the situation calls
> for it (e.g. tooltip instructions or an error message).
>
>
> On 3/20/19, Khoa Pham < <EMAIL REMOVED> > wrote:
>> Is having an aria-describedby sufficient for a form element to be
>> considered accessible in place of a HTML label, aria-label, or
>> aria-labelledby?
>> Accessibility checkers tend to flag a form element as not having a
>> proper label when it only has aria-describedby affiliated to it even
>> though there are text around the form element. Or would the form
>> element still require a label?
>>
>> >> >> archives at http://webaim.org/discussion/archives
>> >>
>
>
> --
> Work hard. Have fun. Make history.
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >
http://webaim.org/discussion/archives
http://webaim.org/discussion/archives