Apple unveils fix for Safari’s messy layout on iPhone Duo’s external display

In a new post on the WebKit blog highlighting what’s new in Safari 27.1, Apple’s Jen Simmons said the company is investigating ways to make websites use the iPhone Duo’s external display better. Here are the details.

Apple knows that Safari does not fully utilize the iPhone Duo’s external display

One issue highlighted in several iPhone Duo reviews (including ours) was the fact that Safari’s right-aligned controls take up a significant portion of the external display’s limited screen space, leaving websites with an unusually narrow area to display their content.

Here’s what Chance Miller had to say about it in his review, published earlier this week:

But the difficulty of the iPhone’s 5.4-inch external display shows up in Safari. The web is simply not optimized for this form factor. I will talk more about this later, but the right-aligned controls on iPhone Duo eat into the usable screen real estate in Safari in particular.

[…]

I can see why Apple chose the design it did for Safari on the iPhone Duo. I don’t think overlapping the controls with the website would make sense. Still, scrolling in Safari is one of the best examples of something that’s better on the inner screen.

For new iPhone Duo users who have also been frustrated by this issue, Apple’s Jen Simmons shared some good news today.

In a post highlighting what’s new in Safari 27.1, including how web pages adapt to the iPhone Duo’s different screen sizes and folding positions, Simmons acknowledged that web pages currently don’t extend beyond the controls on the device’s outer display, and said Apple is investigating ways to address this limitation.

From her post:

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

Simmons further explained that it simply uses the HTML viewport meta tag with viewport-fit="cover" Extending websites behind Safari’s controls could cause problems, as many websites don’t account for these areas properly, potentially hiding important content.

Instead, she invited developers to share their ideas on how Apple could explore a better approach:

We are investigating if there is a better way to achieve the same result – something more secure and perhaps easier for you to use. If you have any ideas, we’d love to hear them. And stay tuned.

If you’re a web developer and have ideas on how Apple could address this limitation, you can read the full WebKit post for details on how to share your feedback.

Will review on Amazon

Add 9to5Mac as a preferred source on Google
Add 9to5Mac as a preferred source on Google

FTC: We use income earning auto affiliate links. More.

Leave a Comment