WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Usage of title attribute or hidden label

for

From: Paul J. Adam
Date: Nov 7, 2013 8:01AM

Hey Steve, sorry I made the wrong assumption about your’s and Gez’s opinions on the title attribute. I did want to link to his articled because it shows how much easier and less buggy it is to use a title attribute or aria-label as the accessible name. I’m not really seeing the benefit of visually hidden explicit labels any longer.

Good point that the title will turn into the accessible description if used with an aria-label. So it makes more sense to not duplicate the title and aria-label values but instead make the aria-label short and concise since it’s the name and make the title more like a hint or help text that is a bit longer and explains what the control does.

Another way I’ve used the title attribute recently, not related to form inputs, is to handle the fact that iOS does not read aria-expanded.

So for a UI control that expands and collapses a section the code is something like:

<a href=# aria-expanded=false title=“Expands the section”>Blah</a>

&

<a href=# aria-expanded=true title=“Collapses the section”>Blah</a>

This way most ARIA enabled screen readers will speak “Collapsed or Expanded”, all will speak the title, iOS will only speak the title not the expanded attribute.

Something to think about.

Thanks!

Paul J. Adam
Accessibility Evangelist
www.deque.com

On Nov 7, 2013, at 1:11 AM, Steve Faulkner < <EMAIL REMOVED> > wrote:

> There is no disagreement between Gez and I on when to use a title
> attribute, as stated in my article (
> http://blog.paciellogroup.com/2013/01/using-the-html-title-attribute-updated/
> ):
>
> Examples of title attribute use that are USEFUL:
>
> - Labelling frame or iframe elements:
> - <frame *title="navigation"*>
> - Providing a programmatically associated label for a control in
> situations where a visible text label would be redundant:
> - <input type="text" *title="search"*> <input type="submit"
> value="search">
> - labelling controls in data
> tables<http://www.paciellogroup.com/presentations/techshare07/?slideSelect=0#slide28>;
> .
>
>
>
> --
>
> Regards
>
> SteveF
> HTML 5.1 <http://www.w3.org/html/wg/drafts/html/master/>;
>
>
> On 6 November 2013 16:12, Paul J. Adam < <EMAIL REMOVED> > wrote:
>
>> Hey Jennifer, so that’s one article from a TPG employee saying don’t use
>> the title attribute.
>>
>> Here’s an article from another TPG employee saying DO use the title
>> attribute ;) http://juicystudio.com/article/hidden-label-firefox-bug.php
>>
>> I also disagree that the title attribute is bad and posted that comment on
>> Steve’s article you linked to.
>>
>> Paul J. Adam
>> Accessibility Evangelist
>> www.deque.com
>>
>> On Nov 6, 2013, at 10:07 AM, Jennifer Sutton < <EMAIL REMOVED> > wrote:
>>
>>> So, to those who are recommending the title attribute, I'm wondering
>>> whether this article from the Paciello Group is relevant, so may be
>>> worth considering. It's from January of this year:
>>>
>> http://blog.paciellogroup.com/2013/01/using-the-html-title-attribute-updated/
>>>
>>> At 07:05 AM 11/6/2013, Don Mauck wrote:
>>>> I would think that the title attribute should work.
>>>> -----Original Message-----
>>>> From: jyothi gogireddy [mailto: <EMAIL REMOVED> ]
>>>> Sent: Wednesday, November 06, 2013 6:23 AM
>>>> To: <EMAIL REMOVED>
>>>> Subject: [WebAIM] Usage of title attribute or hidden label
>>>>
>>>> Hi All,
>>>>
>>>> I have a scenario where I can't use visual text label does title
>>>> attribute to input field or a hidden label will be a better option
>>>> to implement as per accessibility guideline.
>>>>
>>>> Thanks in advance.
>>>>
>>>> Regards,
>>>> Jyothi
>>>> Accessibility Consultant
>>>> >>>> >>>> >>>> >>>> >>>> >>>
>>> >>> >>> >>
>> >> >> >>
> > >