htmlanimated-gifapngimage-fallback

Animated PNG (APNG) fallback to gif in unsupported browsers?

So apparently APNGs fall back to the first frame for unsupported browsers

But is there a way to make it fall back to a gif in unsupported browsers, like we do for webP? 

<picture>
  <source srcset="image.webp" type="image/webp">
  <source srcset="image.jpg" type="image/jpeg">
  <img src="image.jpg">
</picture>
Solution

  • This works! (I thought it was just because the support for <picture> and animated png are very similar (here & here), but it also works in 'UC Browser for Android', which apparently supports <picture> but not APNG) 🎉

    <picture>
  <source srcset="image.png" type="image/apng">
  <source srcset="image.gif" type="image/gif">
  <img src="image.gif">
</picture>