The iPhone Duo and Safari, continued

Here we go again. The webkit team writes about new iPhone Duo-specific features in Safari:

In Safari 27.1, web content does not currently extend to fill the space behind these controls. Just like on other platforms, Safari looks at the web page and extends its background color to fill the space.

We would like to give web designers and developers the ability to design and use that space in more creative ways. Perhaps you want to extend your header background across the full width of the display, for example. It might seem like there’s just one obvious way to make this possible, but really there are many possibilities.

Apple has done Safari users dirty for a while (see Liquid Glass, their terrible tab designs, etc). I use Safari day in and day out every day, and I do not love it anywhere. It’s not as bad of an app as Music on the Mac (which breaks my heart every day), but Safari hasn’t had a great UI for a couple years.

But this drives me nuts. Their image example of how bad Safari looks on the outer screen of a Duo is insane to me. I don’t know how they didn’t think to improve this in the many months before the Duo launched. (Maybe the Safari team was kept in the dark on the Duo. Who knows?)

It seems obvious to me that the answer is to use environment controls to solve this problem, but the Webkit people say this:

We could use the HTML viewport meta tag with viewport-fit="cover" to extend the webpage into that space, hoping developers also use the appropriate environment variables to scoot important content away from system controls. But as we research how today’s sites are built, we see a lot of projects that fail to inset all four edges correctly. 

A lot of projects fail to inset all four edges correctly because nobody has had a reason to before! This is like Apple saying, before the Duo released, that third-party iOS developers have shown no interest in making folding phone apps because they’ve never made them before. If you don’t give people a reason to use a tool, they won’t invest the effort. Web development is filled with enough landmines and gotchas as it is.

Also, the viewport sizes the Webkit shares for the Duo are very odd. Only 382 points wide in some cases! I haven’t seen a viewport that small since the last iPhone mini. If this thing takes off, which it appears to be, I’m going to end up needing one of these just for testing. (That’s an expensive test device. If your organization needs outside design help, hire me.) It’s such an unusual size that I imagine it’s going to be hard to simulate how Safari feels to use in the browser inspector. 

Jen Simmons is in charge of this, and you can share your thoughts on this with her on Bluesky or Mastodon