Wednesday, March 19, 2014

iOS 7.1 Mobile Safari Minimal UI

Apple:

A property, minimal-ui, has been added for the viewport meta tag key that allows minimizing the top and bottom bars on the iPhone as the page loads. While on a page using minimal-ui, tapping the top bar brings the bars back. Tapping back in the content dismisses them again.

For example, use <meta name="viewport" content="width=1024, minimal-ui”>.

Jonathan M. Hollin:

This is a fantastic and long overdue directive for Mobile Safari. Put simply, the minimal-ui property allows you to display your responsive web page without the browser chrome taking up valuable screen real-estate.

untog:

This fixes one of my biggest annoyances with iOS7 Safari - that it ‘steals’ 50px or so of tappable space at the bottom of the screen. If you try to use it, it shows the bottom bar instead of allowing you to interact with the page.

Matthew Banbury:

This reminds me of the era of chromeless popup windows. I do not like this move by Apple. A site should not be capable of deciding to make changes to a users browser UI. Especially changes that aren’t explained. I’m actually disappointed this exists.

It seems like an OK pragmatic solution to me, so long as sites don’t use it gratuitously.

Maximiliano Firtman:

Think about usability: the user will not have the back, the share and the tabs buttons available by default. If you are creating an immersive game or a webapp with the main navigation controls then minimal-ui is a good idea; for content- and document-based websites, it might not be nice for the user.

1 Comment

"so long as sites don’t use it gratuitously"

Given how many sites, including 1st rate news sites who ought know better, that disable pinch to zoom in Safari I have little confidence these things won't be used gratuitously. I like the idea - it'll make web apps more like native apps. I just don't have a lot of faith in most designers. (Or their clients, whomever it is that's responsible for so many bad sites for iOS)

Stay up-to-date by subscribing to the Comments RSS Feed for this post.

Leave a Comment