Video media in image contexts

[Schweinepriester]

https://webkit.org/blog/8042/release-notes-for-safari-technology-preview-46/

Included "video/*" in image request Accept header if the browser supports video media in image contexts

Way more detail: https://calendar.perfplanet.com/2017/animated-gif-without-the-gif/

TL;DR: <img src="ottawa-river.mp4">

If there is a spec, please post it here.

I do think this is controversial, but its got to be tracked, right?

---

Video is image now boiiis

¯\_(ツ)_/¯

[Schweinepriester]

Coming with Safari 11.1 (including iOS 11.3):

• https://twitter.com/rmondello/status/956257331527864320
• https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_11_1.html#//apple_ref/doc/uid/TP40014305-CH14-SW4

[Schweinepriester]

More resources:

• https://css-tricks.com/fallbacks-videos-images/
• http://www.brucelawson.co.uk/2018/video-as-the-new-gif-in-safari/
• https://justmarkup.com/log/2018/02/gifhancement/

---

<picture>
  <source type="video/mp4" srcset="adorable-cat.mp4">
  <!-- perhaps even an animated WebP fallback here as well -->
  <img src="adorable-cat.gif" alt="adorable cat tears throat out of owner and eats his eyeballs">
</picture>

Imho seems like a good solution, but maybe instead of WebP fallback APNG for higher quality and browser support: https://caniuse.com/#feat=webp vs https://caniuse.com/#feat=apng

[Charuru]

Will just throw in this resource too: https://cloudinary.com/blog/evolution_of_img_gif_without_the_gif

[Schweinepriester]

• Chromium: https://bugs.chromium.org/p/chromium/issues/detail?id=791658
• Spec issue: Require img to be able to load the same video formats as video supports whatwg/html#7141

[Schweinepriester]

Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=895131