What’s New in Safari for iOS 11.3

Posted on
Contents

The iOS 11.3 update, available now as a developer and public beta and expected for launch to all in Spring brings several new features to Safari including access to several new Web APIs - Service Workers, Payment Request API, HTMLImageElement.decode(), Directory Upload and Beacon API.

Some of the highlights:

Silent Video as an <img>

It’s now possible to use a silent video in place of an animated GIF (as the file sizes are usually smaller), 

<img src="funny-cat.mp4" alt="" />

It’s worth noting that even if the video has sound, it’ll be silent. So if possible export the video without sound to save space.

Of course, most other browsers don’t support this but there’s a solution with a fallback: 

<picture>
  <source srcset="funny-cat.mp4" type="video/mp4" />
  <img src="funny-cat.gif" alt="" />
</picture>

Website Not Secure Warnings

Users will see a “Website Not Secure” warning when the user focus moves to a password or credit card form on an insecure page - like Chrome does already. If you have a password form on your site without HTTPS then now would be a good time to get that fixed.

Website Not Secure Warning - Safari

Fix for the incorrect caret position on input fields

Fix for a pesky bug which affects the cursor position on input fields inside a fixed position parent.

Webkit input bug

As reported on the Bootstrap repo on GitHub .

Experimental Features

Futhermore - there are six new additions in Settings > Safari > Advanced > Experimental

  • Accessibility Object Model Link
  • Cache API Link
  • ImageBitmap and Offscreen Canvas Link
  • Link Preload Link
  • ServiceWorkers Link
  • Storage Access API Link
  • VisualViewportAPI Link

Read more about Safari for iOS 11.3 at apple.com

I’m hoping that support for inputmode and datalist will be added to a future version of Safari. The ability to access developer tools or at the very least view page source from an iPad would be very helpful.

UPDATE: 24/03/2018: Added that the incorrect caret position on input fields bug is now fixed.

You might also like