WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Using title attribute on non-anchor elements?

for

From: Paul J. Adam
Date: May 2, 2016 8:12AM


Title only speaks as the accessible name or accessible description when placed on focusable elements like <a href> <input> <button>, image elements <img> or role=img, <iframe> elements.

I've never seen a screen reader speak the title on static text elements like <th> or <div> or <p>

Title will never appear visually to keyboard users, it only appears on mouse hover.

If you want to make a keyboard accessible tooltip you'll have to code it with JavaScript.

Easiest solution is to make the element with a title attribute focusable and then it will speak to the screen reader. But if the title info is important and needs to be conveyed to keyboard users then you'll need to make an accessible tooltip.

Would be nice if the browser developers would make their title tooltips keyboard operable by default!

Paul J. Adam
Accessibility Evangelist
www.deque.com

> On May 2, 2016, at 8:22 AM, Alex Hall < <EMAIL REMOVED> > wrote:
>
> Hi all,
> I have a results table showing what was pulled from a database query. I'm
> using the title attribute on some th and td elements to, hopefully, show
> some data when the user mouses over it. NVDA under Firefox doesn't seem to
> indicate that this title is there at all, and I don't know if there's a way
> to have it do so. Is this a shortcoming/bug in NVDA, or is using title on
> non-anchors not recommended for conveying information to screen readers? If
> the latter, what's a good alternative? Would using JQuery's onFocus to
> populate a hidden div work, or is there something simpler? Thanks.
>
> --
> Alex Hall
> Automatic Distributors, IT department
> <EMAIL REMOVED>
> > > >