3 ms·
There are many cases in which animated images are used today where requiring autoplay would break. For example, an online group chat platform that uses tiny ani
by lilyball 4y ago
There are many cases in which animated images are used today where requiring autoplay would break. For example, an online group chat platform that uses tiny animated images for reaction indicators. Having to individually play each reaction image would make them unusable.
The proper way to handle this is to respect the prefers-reduced-motion CSS media feature. If I have that enabled, non-user-initiated animations should not run. I do not want to make an argument as to whether the <img> tag should natively do this or whether sites should handle this instead, just that prefers-reduced-motion seems like the right approach unless there's some strong reason to animate a given item regardless of that setting.
- lapcat 4y ago> Having to individually play each reaction image would make them unusable. Good, I'm not a fan of them ;-) > The proper way to handle this is to respect the prefers-reduced-motion CSS media feature. There's a big difference between clicking to play an animation and never playing an animation. The <video> element uses the former. But prefers-reduced-motion seems more appropriate for the latter. In any case, why wouldn't prefers-reduced-motion also make reaction animations unusable?
- lilyball 4y agoBecause prefers-reduced-motion isn't the default, but "no autoplay" is. And prefers-reduced-motion is also the correct answer here, because people who have prefers-reduced-motion enabled most likely don't want animating reaction images (they're a perfect example of the sort of motion that this setting is supposed to suppress).
- lapcat 4y ago> people who have prefers-reduced-motion enabled most likely don't want animating reaction images (they're a perfect example of the sort of motion that this setting is supposed to suppress). I don't want AUTO-animating images. That's a crucial distinction. I still want to be able to see the animation, if desired. It should be under user control. Reduced motion is not the kind of thing you can trivially turn off and on. You have to go layers deep into settings to find and change it. This is why click to play is the correct answer here.
- jjcm 4y agoI don't think `prefers-reduced-motion` disabling gifs by default is the right approach here. The goal of the tag is to reduce non-essential motion, but gifs may have essential information on a frame other than the first. There's definitely arguments to be made around whether or not you should have information in a gif, but I see this argument akin to whether or not a page should work without javascript. We've moved to a state on the web where usage is so high we can't really turn back.
- lilyball 4y ago> The goal of the tag is to reduce non-essential motion, but gifs may have essential information on a frame other than the first. This is why I said I wasn't taking a stand on whether the <img> tag should apply this logic natively. It really depends on the content and context of the image. Not doing it natively means most sites won't bother to implement the prefers-reduced-motion, but doing it natively means images with meaningful content buried in the animation would effectively be broken.