Your website is pretty, but it's making me dizzy
February 24, 2018 9:07 AM   Subscribe

Recently, I've been encountering a lot of websites with moving pictures that make me dizzy. A lot of these are websites that I need to look at for work. Apparently, this is a known accessibility issue. Can you help me figure out how to fix it? I'm looking both for individual solutions, like low-motion settings for my browser, and also for resources to help me explain the problem and argue for more-accessible websites.

I have chronic vertigo and sensory processing disorder. I suspect these two things are related: certain sensory experiences definitely set off my vertigo. Recently, I've been encountering a lot of websites that have animated backgrounds, which don't really serve any purpose except to look cool. Here's an example, although not a particularly terrible one. I work at a university, and many departments are updating their websites to feature this kind of moving image at the top of the page, right below the navigation bar. For instance, when you go to the business school's website, there's an overhead shot of the quad, with people walking, on which the camera pans out. Then there's a sudden transition to a close-up scene of a different crowded walkway, with students walking all directions as the camera pans in. Then there's a transition to a classroom scene, with the camera moving over students who are writing things and then on to a professor who is talking animatedly. All of the scenes feature simultaneous camera movement and movement in the image, and they make me literally ill.

Part of my job involves showing these websites to students, so I can't avoid them. I was listening to a podcast for web developers, and their guest on an episode about adding animation mentioned that there were accessibility issues for people with vestibular disorders and that developers needed to make sure that they complied with certain standards to allow people to turn the animations off. It sounds like there may be fixes for this problem, and I would really like to find them.

I guess that I'm looking for three things:

1. What are tools that I personally can use to turn off or slow down web animation? Are there browser plug-ins that will disable this kind of motion?

2. I would like to bring this up with the people who handle web accessibility issues in the university IT department. I checked their standards, and it actually seems to be covered, because there's a section that says:
Moving, blinking, scrolling: For any moving, blinking or scrolling information that (1) starts automatically, (2) lasts more than five seconds, and (3) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it unless the movement, blinking, or scrolling is part of an activity where it is essential;
However, they either don't care about that or don't see the new moving websites as being in conflict with that. How can I best bring this up with them? Are there articles that I can show them that will support my concerns?

3. Are there effective ways to discuss this with owners of websites that aren't affiliated with my workplace? Are there ways to spread the word about this problem or advocate more generally about it?
posted by ArbitraryAndCapricious to Computers & Internet (7 answers total) 10 users marked this as a favorite
I don't know about slowing down the animations (in fact that seems like it might be quite complicated to do, technically, for all possible types of animations) but you can completely block all images, video, and plugins like Flash with the uMatrix browser add-on, which can also save different settings for what to allow on each website.

That might not work by itself for the occasions when you're actually showing the websites to students, but my thought on that is: I remember seeing software that remotely synchronized two web browsers for presentation or online learning or something like that. (It was a different thing from Chromecast-type applications that simply transmit video of the browser; this somehow involved remotely controlling one browser with via the other one.) If you can find that sort of software and it's compatible with uMatrix, maybe you could have two computers—yours with the images turned off, and another one the students are looking at while you click around the site you're showing them.
posted by XMLicious at 9:32 AM on February 24, 2018

I haven't tried it, but there's an Animation Policy extension for Chrome. An odd fact I noticed is that if you check "By Google" in the extension search widget, it doesn't come up, even though the publisher name is Google Accessibility like several others. So that's odd, but perhaps a plausible explanation is that someone forgot to check a box somewhere for this extension.
posted by Wobbuffet at 9:43 AM on February 24, 2018

I'd say to look for extensions or settings that disable Autoplay in the browser. You might also try uBlock. It's sometimes tricky, but you can use often use uBlock's element picker to block the offensive video so it doesn't cause you issues. My browsers (with uBlock) actually blocked the video you linked to, but that may be because I've also turned off video autoplay. If you go this route, using the browser's Private or Incognito mode with no extensions will allow you to see the original site.

I'm not sure you'll find a lot of success slowing down animations, because there are so many ways it can be done.
posted by cnc at 3:15 PM on February 24, 2018

You might also look at this Video Blocker Chrome extension or this Image Video Block Firefox extension.
posted by Aleyn at 3:22 PM on February 24, 2018

Most of these effects are, these days, accomplished with some form of JavaScript. You can run NoScript to block them before they run, if you use Firefox.
posted by Happy Dave at 1:38 AM on February 25, 2018

For your second question:

The type of animation or video you describe is definitely a failure of the Web Content Accessibility Guidelines, criteria 2.2.2: Pause, Stop, Hide. This kind of thing also affects people with attention disorders as well. Your university might be opening themselves up to complaints or even legal action, depending on how they handle this situation.

Val Head has some useful explanations and links about the proposed reduced-motion query. I think reduced-motion should be a browser setting, similar to how the iPhone operating system lets you choose a less-animated version of the user interface.

If your IT or web department isn’t helpful or supportive of your needs, you might be able to get someone to make you a browser bookmarklet to disable the video on the sites you are required to use. I don’t think it would be possible to make something that would work on all websites, but you could definitely target some specific cases.

But really the web team should provide a stop button, with cookies to remember the user’s preference. I’d also question why they’re forcing everyone to download a video, and what the performance is like when a student uses their phone to look at the site without wifi. Not everyone is using the site in an office.

If this isn’t the podcast you already heard, it might be a good one to send to the web team: The Big Web Show: Marissa Christina.
posted by harriet vane at 3:20 AM on February 25, 2018 [4 favorites]

Note that uBlock Origin and uBlock as mentioned by cnc are two different open-source projects, both based on the work of software developer Raymond Hill who is still associated with the uBlock Origin project and the accompanying tool uMatrix I mentioned above. (I think both have the element picker cnc suggests.)
posted by XMLicious at 3:36 AM on February 25, 2018

« Older Durable micro USB cable?   |   Fire Safety during College Exams Newer »
This thread is closed to new comments.