WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: spinners/loading animations

for

From: Ugurcan Kutluoglu
Date: Oct 8, 2017 4:19PM

I'm not 100% certain, but the WCAG rule seems to have an exception for
loading animations.

https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-pause.html

A "loading" animation
> A preloader animation is shown on a page which requires a certain
> percentage of a large file to be downloaded before playback can begin. The
> animation is the only content on the page and instructs the user to please
> wait while the video loads. Because the moving content is not presented in
> parallel with other content, no mechanism to pause, stop or hide it needs
> to be provided, even though the animation may run for more than 5 seconds
> for users with slower connections.


On Fri, Oct 6, 2017 at 8:05 AM, Swift, Daniel P. < <EMAIL REMOVED> > wrote:

> Ugi:
>
> The way you describe the lazy loading is exactly what we are doing. We
> are swapping the src attribute once the image is in viewport. My concern
> is with WCAG 2.2.2 -- that the spinner could spin longer than 5 seconds if
> the user is on a slow connection or indefinitely if the user has JS
> disabled.
>
> Thoughts?
>
> Dan Swift
> Senior Web Specialist
> Enterprise Services
> West Chester University
> 610.738.0589
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
> Behalf Of Ugurcan Kutluoglu
> Sent: Thursday, October 05, 2017 4:23 PM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] spinners/loading animations
>
> Hi Dan,
>
> Could you clarify the purpose of the loading animation?
>
> If you are lazy-loading images, there's really not much you have to do.
> Most lazy loading scrips that I've encountered, re-uses the same IMG tag
> and just modifies the src attribute once the image is in viewport. You
> should be safe, as long as the IMG tag has the appropriate alt text.
>
> However, if you are loading page sections, you may have to alert screen
> reader users depending on the situation.
>
> Ugi
>
> On Thu, Oct 5, 2017 at 7:45 AM, Swift, Daniel P. < <EMAIL REMOVED> > wrote:
>
> > Can someone provide some clarification on loaders/spinners in regards
> > to accessibility? We are using something like this when we lazy-load
> content:
> > http://thinkfuture.com/wp-content/uploads/2013/10/loading_spinner.gif
> >
> > In theory, the image should've be visible for longer than 5 seconds ...
> > but it is possible if there is a slow connection. Should we remove
> > the 'loading/spinner' image after 5 seconds or substitute it with a
> > static image of a spinner or are loaders/spinners exempt?
> >
> > Thanks!
> >
> > Dan Swift
> > Senior Web Specialist
> > Enterprise Services
> > West Chester University
> > 610.738.0589
> >
> > > > > > archives at http://webaim.org/discussion/archives
> > > >
> > > at http://webaim.org/discussion/archives
> > > > > >