WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Is it okay to add role="tooltip" to static elements?

for

From: Bryan Garaventa
Date: Jun 29, 2012 1:10AM

Ah yes, I see your point.

The concept is what sounds odd to me, since I imagine aria-labelledby for
instance to mirror the functionality of an explicit label.

----- Original Message -----
From: "Steve Faulkner" < <EMAIL REMOVED> >
To: "WebAIM Discussion List" < <EMAIL REMOVED> >
Sent: Thursday, June 28, 2012 2:16 AM
Subject: Re: [WebAIM] Is it okay to add role="tooltip" to static elements?


> Hi Bryan,
>
> provided test page:
> https://dl.dropbox.com/u/377471/tests/labelledby-tabindex.html
>
> for the tests without tabindex-1 NVDA does not read the full label or
> description
>
> you wrote:
>
> "The concept of requiring tabindex=-1 on all elements referenced by
> aria-labelledby/aria- describedby sounds very similar to saying that the
> only
> way to make explicit form field labels is to include tabindex=-1 on all
> Label elements, which isn't making sense to me."
>
> don't understand this comment. The concept is one documented by
> microsoft.
> tabindex is only required on elements that are not defined as accessible
> elements in IE, that is why i suggest using a label element as it does not
> require tabindex.
>
> regards
> Stevef
>
>
>
> On 28 June 2012 09:03, Bryan Garaventa < <EMAIL REMOVED> >
> wrote:
>>
>> "its not so much a bug as a constraint due to IE's accessibility
>> architecture which they have documented it"
>>
>> True, and it looks like the screen readers have compensated for this by
>> processing the aria-labelledby and aria-describedby attributes correctly.
>> Can you give me examples of which screen readers these attributes are not
>> working correctly on in IE? This would help.
>>
>> "and the user will not hear the label or description"
>>
>> This is what's confusing me, because I am hearing descriptions on all of
> my
>> implementations using IE8 and 9 with JAWS12 and 13, and even in NVDA in
> IE 8
>> and 9 (though NVDA is programmed to work better in Firefox). I would
>> definitely notice if they were not working in IE.
>>
>> The concept of requiring tabindex=-1 on all elements referenced by
>> aria-labelledby/aria-describedby sounds very similar to saying that the
> only
>> way to make explicit form field labels is to include tabindex=-1 on all
>> Label elements, which isn't making sense to me.
>>
>>
>> ----- Original Message -----
>> From: "Steve Faulkner" < <EMAIL REMOVED> >
>> To: "WebAIM Discussion List" < <EMAIL REMOVED> >
>> Sent: Wednesday, June 27, 2012 10:45 PM
>> Subject: Re: [WebAIM] Is it okay to add role="tooltip" to static
>> elements?
>>
>>
>> > Hi Bryan,
>> >
>> >>So this would be a bug in IE would it not?
>> >
>> > its not so much a bug as a constraint due to IE's accessibility
>> > architecture which they have documented it
>> >
>> >>how is this not accessible when the correct data is being conveyed?
>> >
>> > The correct data is not being conveyed via the accessibility API in IE.
> So
>> > AT that rely upon the browser to provide such information will not get
> it
>> > and the user will not hear the label or description.
>> >
>> > regards
>> > SteveF
>> >
>> >
>> > On 28 June 2012 05:02, Bryan Garaventa < <EMAIL REMOVED> >
>> > wrote:
>> >
>> >> So this would be a bug in IE would it not?
>> >>
>> >> And even if the screen reader is parsing the correct data in the
>> >> meantime,
>> >> how is this not accessible when the correct data is being conveyed?
>> >>
>> >> ----- Original Message -----
>> >> From: "Steve Faulkner" < <EMAIL REMOVED> >
>> >> To: "WebAIM Discussion List" < <EMAIL REMOVED> >
>> >> Sent: Wednesday, June 27, 2012 8:09 PM
>> >> Subject: Re: [WebAIM] Is it okay to add role="tooltip" to static
>> >> elements?
>> >>
>> >>
>> >> > hi bryan,
>> >> >
>> >> > you wrote:
>> >> >
>> >> > "the multiple labels appear to be reading without a problem in IE."
>> >> >
>> >> > Some scree readers do not rely exclusively upon the accessibility
>> >> > API
>> >> > information being exposed for aria-labelledby and aria-describedby,
>> >> > they
>> >> > derive the accessible name and description directly from the DOM.
>> >> > Others
>> >> > do
>> >> > not.
>> >> >
>> >> > Testing the accessible name and accessible description being exposed
>> >> > via
>> >> > the MSAA API using an inspect tool shows the effect of the described
>> >> > constraints in IE.
>> >> >
>> >> >
>> >> >
>> >> > regards
>> >> > Stevef
>> >> >
>> >> >
>> >> >
>> >> > On 28 June 2012 03:16, Bryan Garaventa
>> >> > < <EMAIL REMOVED> >
>> >> > wrote:
>> >> >
>> >> >> "In IE if you use aria-labelledby with multiple id references or
>> >> >> aria-describedby with single or multiple id references, the
> referenced
>> >> >> elements must be what Microsoft terms as accessible HTML elements.
> So
>> >> >> tabindex=-1 would have to be added to the <p"
>> >> >>
>> >> >> I haven't seen this to be the case. For example, on the page at
>> >> >> http://whatsock.com/modules/carousel_from_xml_module/demo.htm
>> >> >> When you click the Generate Wizard from XML button, it opens a
> wizard
>> >> >> dialog. All of the form fields use aria-labelledby, and the first
>> >> >> field
>> >> >> references two IDs. Neither of the label divs have tabindex=-1, and
>> >> >> the
>> >> >> multiple labels appear to be reading without a problem in IE.
>> >> >>
>> >> >> > From: Steve Faulkner [mailto: <EMAIL REMOVED> ]
>> >> >> > Sent: Wednesday, 27 June 2012 11:53 PM
>> >> >> > To: Ian Yang
>> >> >> > Cc: <EMAIL REMOVED>
>> >> >> > Subject: Re: Is it okay to add role="tooltip" to static elements?
>> >> >> >
>> >> >> >
>> >> >> >
>> >> >> > Hi Ian,
>> >> >> >
>> >> >> > The text is not a tooltip, tooltips have particular properties
>> >> >> > associated
>> >> >> > with them: http://www.w3.org/WAI/PF/aria-practices/#tooltip
>> >> >> >
>> >> >> > Note:
>> >> >> >
>> >> >> > In IE if you use aria-labelledby with multiple id references or
>> >> >> > aria-describedby with single or multiple id references, the
>> >> >> > referenced
>> >> >> > elements must be what Microsoft terms as accessible HTML
>> >> >> > elements.
>> >> >> > So
>> >> >> > tabindex=-1 would have to be added to the <p> refer to Making Non
>> >> >> > accessible
>> >> >> > Elements Accessible
>> >> >> >
>> >> >> >
>> >> >> > regards
>> >> >> > Stevef
>> >> >> >
>> >> >> > On 27 June 2012 14:24, Ian Yang < <EMAIL REMOVED> > wrote:
>> >> >> >
>> >> >> > Hi Steve,
>> >> >> >
>> >> >> > Yes, the example uses aria-describedby to associate the static <
> p >
>> >> >> > element and the < input > field so the information will be
> announced
>> >> >> > when the field receives focus.
>> >> >> >
>> >> >> > The issue which I'm trying to figure out is if adding
> role="tooltip"
>> >> >> > to the static < p > element has bad effects on assistive
>> >> >> > technologies.
>> >> >> >
>> >> >> > Regards,
>> >> >> > Ian
>> >> >> >
>> >> >> > 2012/6/27 Steve Faulkner < <EMAIL REMOVED> >:
>> >> >> >
>> >> >> >> Hi Ian,
>> >> >> >>
>> >> >> >> I suggest its better to include the text within the label for
>> >> >> >> the
>> >> form
>> >> >> >> field
>> >> >> >> so the information will be announced when the field recieves
> focus:
>> >> >> >>
>> >> >> >> examples and details here:
>> >> >> >> http://www.html5accessibility.com/tests/mulitple-labels.html
>> >> >> >>
>> >> >> >> regards
>> >> >> >> steve
>> >> >> >>
>> >> >> >>
>> >> >> >> On 27 June 2012 12:50, Ian Yang < <EMAIL REMOVED> > wrote:
>> >> >> >>>
>> >> >> >>> Hi everyone,
>> >> >> >>>
>> >> >> >>> Please take a look at this image (
>> >> >> >>>
>> >> >> >>>
>> >> >> >>>
>> >> >>
>> >>
> http://www.lessfussdesign.com/blog/http://www.lessfussdesign.com/images/blog/form-screen-2009-08-10.gif
>> >> >> >>> ) which is taken from this blog page (
>> >> >> >>>
>> >> >> >>>
>> >> >> >>>
>> >> >>
>> >>
> http://www.lessfussdesign.com/blog/2010/08/using-aria-describedby-for-form-help-text/
>> >> >> >>> ).
>> >> >> >>>
>> >> >> >>> The image shows that there is a static description paragraph (<
> p
>> >> >> >>> >
>> >> >> >>> element) below the password input field. In that case, is it
> okay
>> >> >> >>> to
>> >> >> >>> add ARIA role="tooltip" to the static < p > element?
>> >> >> >>>
>> >> >> >>> In most web designs, tooltips are often designed as "popups"
> which
>> >> >> >>> are
>> >> >> >>> triggered by mouse hover. However, if I understand it
>> >> >> >>> correctly,
>> >> >> >>> "tooltip" literally means "tip of tool" and doesn't imply that
>> >> >> >>> a
>> >> >> >>> tooltip must be a "popup" thing. So, can I add role="tooltip"
>> >> >> >>> to
>> >> >> >>> elements which can be considered as "tip of tool", even if they
>> >> >> >>> are
>> >> >> >>> static elements? (Just like the example above) By doing so, I
> feel
>> >> >> >>> they are markup'ed more meaningfully, and we also get the
> benefit
>> >> >> >>> of
>> >> >> >>> having styling hooks.
>> >> >> >>>
>> >> >> >>> I'm not sure whether adding role="tooltip" to static elements
> has
>> >> >> >>> negative effects to assistive technologies or not. Is this idea
>> >> >> >>> appropriate or inappropriate?
>> >> >> >>>
>> >> >> >>>
>> >> >> >>> Kind Regards,
>> >> >> >>> Ian
>> >> >> >>>
>> >> >> >>
>> >> >> >>
>> >> >> >>
>> >> >> >> --
>> >> >> >> with regards
>> >> >> >>
>> >> >> >> Steve Faulkner
>> >> >> >> Technical Director - TPG
>> >> >> >>
>> >> >> >> www.paciellogroup.com | www.HTML5accessibility.com |
>> >> >> >> www.twitter.com/stevefaulkner
>> >> >> >> HTML5: Techniques for providing useful text alternatives -
>> >> >> >> dev.w3.org/html5/alt-techniques/
>> >> >> >> Web Accessibility Toolbar -
>> >> >> >> www.paciellogroup.com/resources/wat-ie-about.html
>> >> >> >>
>> >> >> >
>> >> >> >
>> >> >> >
>> >> >> >
>> >> >> > --
>> >> >> > with regards
>> >> >> >
>> >> >> > Steve Faulkner
>> >> >> > Technical Director - TPG
>> >> >> >
>> >> >> > www.paciellogroup.com | www.HTML5accessibility.com |
>> >> >> > www.twitter.com/stevefaulkner
>> >> >> > HTML5: Techniques for providing useful text alternatives -
>> >> >> > dev.w3.org/html5/alt-techniques/
>> >> >> > Web Accessibility Toolbar -
>> >> >> > www.paciellogroup.com/resources/wat-ie-about.html
>> >> >>
>> >> >> >> >> >> >> >> >> >> >> >>
>> >> >
>> >> >
>> >> >
>> >> > --
>> >> > with regards
>> >> >
>> >> > Steve Faulkner
>> >> > Technical Director - TPG
>> >> >
>> >> > www.paciellogroup.com | www.HTML5accessibility.com |
>> >> > www.twitter.com/stevefaulkner
>> >> > HTML5: Techniques for providing useful text alternatives -
>> >> > dev.w3.org/html5/alt-techniques/
>> >> > Web Accessibility Toolbar -
>> >> > www.paciellogroup.com/resources/wat-ie-about.html
>> >> > >> >> > >> >> > >> >>
>> >> >> >> >> >> >> >>
>> >
>> >
>> >
>> > --
>> > with regards
>> >
>> > Steve Faulkner
>> > Technical Director - TPG
>> >
>> > www.paciellogroup.com | www.HTML5accessibility.com |
>> > www.twitter.com/stevefaulkner
>> > HTML5: Techniques for providing useful text alternatives -
>> > dev.w3.org/html5/alt-techniques/
>> > Web Accessibility Toolbar -
>> > www.paciellogroup.com/resources/wat-ie-about.html
>> > >> > >> > >>
>> >> >> >
>
>
>
> --
> with regards
>
> Steve Faulkner
> Technical Director - TPG
>
> www.paciellogroup.com | www.HTML5accessibility.com |
> www.twitter.com/stevefaulkner
> HTML5: Techniques for providing useful text alternatives -
> dev.w3.org/html5/alt-techniques/
> Web Accessibility Toolbar -
> www.paciellogroup.com/resources/wat-ie-about.html
> > >