Video in Image Tags

I was really exited when I learned that Safari decided to support video content in image tags! It was scheduled for iOS 11.3 which was supposed to ship Safari 11.1 with all sorts of goodies. I’m not covering service workers here. I’m more exited about replacing animated gifs with mp4 video in <img> tags!

Converting gifs to mp4 is generally a great idea because mp4 is so much more efficient from a web performance perspective than gifs. My hope was that we finally could seamlessly serve optimized content without using any client side javascript hacks but leave the decision to the server, or leverage services like ImageEngine.

iOS 11.3 with Safari 11.1 was supposed to give us opportunity to replace our gifs with video:

<img  src="video.mp4" alt="animation" />

On desktop Safari this works as expected. If you’r reading this page with a Safari 11.1 or above, you’ll see an animation below:

You should see an animation here...

…but if you’re in a iOS device with iOS version 11.3 you’ll see a broken image…. 🙁

Looking at the User-Agents, there is some unexpected differences:

User-Agent macOS:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1 Safari/605.1.15

User-Agent iOS:

Mozilla/5.0 (iPad; CPU OS 11_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.0 Mobile/15E148 Safari/604.1

Seems iOS Safari is stuck at version 11.0 and behind in the build numbers. All other announced functionality, like service workers, is available. But not video content in image tags… 🙁

According to the Safari TP release notes, the browser will announce its support for video media in image contexts by adding video/* to the Accept header if this is supported. iOS Safari does this, but still no video…

So apparently, the earlier announced Safari 11.1 shipment with iOS 11.3 did not happen. The User-Agent says version 11.0 and this is probably correct since it’s not until version 11.1 video content in image contexts is available. On the other hand 11.1 is also the version supporting service workers, but this is also supported by version 11.0 on iOS even if service workers are not mentioned in the 11.0 release notes.

So, something is off here. I submitted a bug.


Comments are closed.