WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Hmmm, JAWS repeats link and button text

for

From: Mark Magennis
Date: Sep 29, 2017 4:00AM

Steve you're a genius. Both for the explanation and the fix. Huge thanks.

Mark

Mark Magennis | Accessibility Support Manager
InterAccess.ie - Accessible UX

> On 29 Sep 2017, at 10:18, Steve Faulkner < <EMAIL REMOVED> > wrote:
>
> Hi mark, the reason i think it occurs is that IE exposes the link label as
> the accessible name for the div (when it has tabindex="-1") This is not the
> case in Firefox.
>
> So i think its a bug in IE, which won't be fixed.
>
> it can be suppressed by adding aria-label="" to the div
> https://codepen.io/stevef/pen/aLwZjM
>
>
> --
>
> Regards
>
> SteveF
> Current Standards Work @W3C
> <http://www.paciellogroup.com/blog/2015/03/current-standards-work-at-w3c/>;
>
> On 29 September 2017 at 10:10, Mark Magennis < <EMAIL REMOVED> > wrote:
>
>> You're right Steve. It's not a problem in FF or Chrome. Only in IE (I'm
>> using IE11).
>>
>> I remember reading somewhere about JAWS actually adding tabindex="-1" when
>> using IE. This isn't the case here though. The tabindex is there from the
>> start.
>>
>> Mark
>>
>>> On 29 Sep 2017, at 09:58, Steve Faulkner < <EMAIL REMOVED> >
>> wrote:
>>>
>>> Hi mark, I cannot replicate the behaviour using JAWS 18 with Firefox 55
>>>
>>> test case used: https://s.codepen.io/stevef/debug/aLwZjM
>>>
>>>
>>>
>>> --
>>>
>>> Regards
>>>
>>> SteveF
>>> Current Standards Work @W3C
>>> <http://www.paciellogroup.com/blog/2015/03/current-
>> standards-work-at-w3c/>
>>>
>>> On 29 September 2017 at 09:28, Mark Magennis < <EMAIL REMOVED> >
>> wrote:
>>>
>>>> Dear all,
>>>>
>>>> A conundrum. Using the code below, when JAWS reads the button, it first
>>>> repeats the link text and the button text before reading the button
>> label.
>>>> Removing the tabindex prevents this. Anyone know why the tabindex has
>> this
>>>> effect? And what can be done to prevent it? Apart from removing the
>>>> tabindex.
>>>>
>>>> <div tabindex="-1">
>>>> <a href="www.google.com <http://www.google.com/>;">Go
>>>> somewhere</a>
>>>> <button aria-label="Press me"></button>
>>>> </div>
>>>>
>>>> Thanks,
>>>> Mark
>>>>
>>>> Mark Magennis | Accessibility Support Manager
>>>> InterAccess.ie - Accessible UX
>>>>
>>>> >>>> >>>> >>>> >>>>
>>> >>> >>> >>> >>
>> >> >> >> >>
> > > >