E-mail List Archives

Search E-mail List Archives for

Number of posts in this thread: 7 (In chronological order)

From: allyssa jessicon
Date: Tue, Dec 17 2019 10:28PM
Subject: Dropdown label issue
No previous message | Next message →

Suppose there is a dropdown with item lists 1,2,3 etc. there is a
visual text to indicate the dropdown name, lets take it as ‘Quantity'.
When I swipe right from the visual text/heading ‘Quantity', screen
reader is reading ‘Quantity' which is hidden and hopefully the label
of the dropdown, but when I swipe right again now screen reader is
reading dropdown list ant, is it a WCAG violation? Which SC is
covering this? Is it Labels or instructions? Any help would be
appreciated.

From: Maxability A11Y
Date: Wed, Dec 18 2019 6:16AM
Subject: Re: Dropdown label issue
← Previous message | Next message →

Hi Allyssa,
The problem is that the screen reader is reading the label twice? one with
visual text and the second is the hidden label for SR users. Is that
correct?
I remember few years back I could remember that's happening when the label
is properly associated with the form control. I would like you to check
a. Is the same happening when riverse swipe i.e. right to left from drop
down back to the label? If it is not reading the label twice in the riverse
order its not a violation.
b. If the hidden text exist and the visual text also exist and SR is
reading twice for that reason, may be its 1.3.2 meaningful sequence. I
might be wrong too. Happy to be corrected.
Thanks & Regards
Rakesh


On Wed, Dec 18, 2019 at 10:58 AM allyssa jessicon < = EMAIL ADDRESS REMOVED = >
wrote:

> Suppose there is a dropdown with item lists 1,2,3 etc. there is a
> visual text to indicate the dropdown name, lets take it as ‘Quantity'.
> When I swipe right from the visual text/heading ‘Quantity', screen
> reader is reading ‘Quantity' which is hidden and hopefully the label
> of the dropdown, but when I swipe right again now screen reader is
> reading dropdown list ant, is it a WCAG violation? Which SC is
> covering this? Is it Labels or instructions? Any help would be
> appreciated.
> > > > >

From: glen walker
Date: Wed, Dec 18 2019 11:20AM
Subject: Re: Dropdown label issue
← Previous message | Next message →

If you have a real <label> and it's associated with a real <select> via the
FOR attribute, then when swiping right (assuming you're testing VoiceOver
on iOS) the visible text for the label will not receive direct focus. The
focus moves to the <select>.

<label for="gifts">pick your gift</label>
<select id="gifts">
<option>car</option>
<option>watch</option>
<option>computer</option>
<option>hug</option>
</select>

However, if your label is just text and you're associating the label with
aria-labelledby or some other mechanism, then the text label *can* be
focused separately from the <select>. That's not a violation. The
<select> still has a proper label so 4.1.2 is ok. You just coded it to
allow a separate voiceover "tab stop". Perhaps not a great user experience
but not a violation.

<p id="gift2s">pick your gift</p>
<select aria-labelledby="gifts2">
<option>car</option>
<option>watch</option>
<option>computer</option>
<option>hug</option>
</select>


On Tue, Dec 17, 2019 at 10:28 PM allyssa jessicon < = EMAIL ADDRESS REMOVED = >
wrote:

> Suppose there is a dropdown with item lists 1,2,3 etc. there is a
> visual text to indicate the dropdown name, lets take it as ‘Quantity'.
> When I swipe right from the visual text/heading ‘Quantity', screen
> reader is reading ‘Quantity' which is hidden and hopefully the label
> of the dropdown, but when I swipe right again now screen reader is
> reading dropdown list ant, is it a WCAG violation? Which SC is
> covering this? Is it Labels or instructions? Any help would be
> appreciated.
> > > > >

From: allyssa jessicon
Date: Wed, Dec 18 2019 8:45PM
Subject: Re: Dropdown label issue
← Previous message | Next message →

Yes, when reverse swiping the same occurs. i would like to know is it
happening because the label is not programmatically associated to the
dropdown control? and in which guideline will it come? how can i
remediate this?

On 12/18/19, glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> If you have a real <label> and it's associated with a real <select> via the
> FOR attribute, then when swiping right (assuming you're testing VoiceOver
> on iOS) the visible text for the label will not receive direct focus. The
> focus moves to the <select>.
>
> <label for="gifts">pick your gift</label>
> <select id="gifts">
> <option>car</option>
> <option>watch</option>
> <option>computer</option>
> <option>hug</option>
> </select>
>
> However, if your label is just text and you're associating the label with
> aria-labelledby or some other mechanism, then the text label *can* be
> focused separately from the <select>. That's not a violation. The
> <select> still has a proper label so 4.1.2 is ok. You just coded it to
> allow a separate voiceover "tab stop". Perhaps not a great user experience
> but not a violation.
>
> <p id="gift2s">pick your gift</p>
> <select aria-labelledby="gifts2">
> <option>car</option>
> <option>watch</option>
> <option>computer</option>
> <option>hug</option>
> </select>
>
>
> On Tue, Dec 17, 2019 at 10:28 PM allyssa jessicon
> < = EMAIL ADDRESS REMOVED = >
> wrote:
>
>> Suppose there is a dropdown with item lists 1,2,3 etc. there is a
>> visual text to indicate the dropdown name, lets take it as ‘Quantity'.
>> When I swipe right from the visual text/heading ‘Quantity', screen
>> reader is reading ‘Quantity' which is hidden and hopefully the label
>> of the dropdown, but when I swipe right again now screen reader is
>> reading dropdown list ant, is it a WCAG violation? Which SC is
>> covering this? Is it Labels or instructions? Any help would be
>> appreciated.
>> >> >> >> >>
> > > > >

From: Jonathan Avila
Date: Thu, Dec 19 2019 7:26AM
Subject: Re: Dropdown label issue
← Previous message | Next message →

On IOS 13 you can use the Voice Control feature to find out if an accessible name is associated with the control. If you turn on Voice Control under Accessibility and say "Show names" it will show the accessible name of each field and label. If there is no accessible name it would just say the role such as "text" for inputs -- but doesn't show anything for select fields. For an input you would see the name twice -- once on the label once on the field if it was associated correctly. If the label was not associated you would see the name on the label but something like "text" for the text field. Unfortunately it doesn't seem to work right with select elements though.

Jonathan

From: glen walker
Date: Thu, Dec 19 2019 6:41PM
Subject: Re: Dropdown label issue
← Previous message | Next message →

If this is an html application, then it would very easy to tell what's
happening if you can provide a code snippet.

On Wed, Dec 18, 2019 at 8:46 PM allyssa jessicon < = EMAIL ADDRESS REMOVED = >
wrote:

> Yes, when reverse swiping the same occurs. i would like to know is it
> happening because the label is not programmatically associated to the
> dropdown control? and in which guideline will it come? how can i
> remediate this?
>
>
>

From: allyssa jessicon
Date: Thu, Dec 19 2019 9:19PM
Subject: Re: Dropdown label issue
← Previous message | No next message

Wow.. that's great! new information.

On 12/20/19, glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> If this is an html application, then it would very easy to tell what's
> happening if you can provide a code snippet.
>
> On Wed, Dec 18, 2019 at 8:46 PM allyssa jessicon
> < = EMAIL ADDRESS REMOVED = >
> wrote:
>
>> Yes, when reverse swiping the same occurs. i would like to know is it
>> happening because the label is not programmatically associated to the
>> dropdown control? and in which guideline will it come? how can i
>> remediate this?
>>
>>
>>
> > > > >