WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Image Buttons

for

From: JP Jamous
Date: Nov 3, 2016 7:57AM

Birkir,

That was my first thought and converting the spans into an img tag for proper semantic. As you mentioned, they won't like it, because it is not a definite solution. I also don't know how difficult low vision users find tooltips.

Can someone that has experience with low vision users shed some light on the title attribute? That will be highly appreciated.

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Birkir R. Gunnarsson
Sent: Thursday, November 3, 2016 8:52 AM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Image Buttons

Not sure your designers would like this much .. but it is ideal.
Second choice, use the title attribute of the button.
Yes, title attribute is not consistently displayed when buttons are focused with the keyboard (except in IE 11/Edge), but that is a user agent choice that should be fixed.
I think that would be a suitable compromise.



On 11/3/16, JP Jamous < <EMAIL REMOVED> > wrote:
> Okay Folks! Here is another one for ya!
>
>
>
> The video player has buttons that have icons showing different symbols
> to operate the player. While my concern is people with cognitive
> disabilities and low vision, I am wondering what approach would be
> best to show the symbol as well as text in the button caption.
>
>
>
> Here is a code sample:
>
>
>
> <button>
>
> <span>
>
> A square icon goes here, using the <i></i>, which is included in Bootstrap.
>
> </span>
>
> <span>
>
> Stop
>
> </span>
>
> </button>
>
>
>
> Is this the best approach to keep the text visible so it is not
> included in the icon itself? My main concern is to find the happy
> medium for all of my audience.
>
>
>
>
>
> > > archives at http://webaim.org/discussion/archives
> >


--
Work hard. Have fun. Make history.