WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: jquery effects accessible?


From: Jonathan Pund
Date: Dec 19, 2013 12:27PM

Okay, thanks for that. I forgot that it is actually an anchor, not a div, so it is keyboard navigable. What I was really hoping for was to ask if jquery has accessibility built into it so that, if a user action triggers the pulsate effect, it would notify the user via ARIA techniques. I have heard that jquery does well with incorporating them into their widgets and the like, so I was wondering if anyone knew if they also incorporate the ARIA techniques into their effects, such as the pulsate effect.

Additionally, I do not believe that the pulsate effect is the same as using color only to convey meaning. Even if one were to turn off all color and make everything black and white, the pulsate effect would still convey meaning. Any other thoughts on this?

-----Original Message-----
From: Ryan E. Benson [mailto: <EMAIL REMOVED> ]
Sent: Thursday, December 19, 2013 10:06 AM
To: WebAIM Discussion List
Subject: Re: [WebAIM] jquery effects accessible?


Yes this has accessibility issues and 508 violations. Visual effect is equivalent to color.

508 violations:
1194.22(c) color - since you are pulsating the background, this is like using color alone to convey meaning.
1194.22(j) flicker.

You also may have some in 1194.21, and .31. On the jQuery page, the div is not keyboard navigable. To fix this, you should be able to add tabindex='-1'.

Ryan E. Benson

On Thu, Dec 19, 2013 at 9:18 AM, Jonathan Pund < <EMAIL REMOVED> >wrote:

> I have an app that is using the "pulsate" jquery effect (
> http://api.jqueryui.com/pulsate-effect/). Here's the context: the user
> needs to choose ten items from a pool, and does so by click on the
> button corresponding to the item. When the list is full, if the user
> clicks on another button in the pool, it pulsates to convey that it
> cannot be moved and that the list is full. These are my questions:
> 1) Is this effect accessible "straight out of the box" from
> the jquery package? Or do I need to make some additions to the code to
> make is accessible?
> 2) Does this violate 508 or any other accessibility mandate by
> only conveying the user "error" with a visual effect? I know that
> would be the case if you were using only color or only sound, but what
> about only a visual effect?
> Thanks in advance,
> Jonathan
> > > list messages to <EMAIL REMOVED>