iOS 7.1 Mobile Safari Minimal UI
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”>.
This is a fantastic and long overdue directive for Mobile Safari. Put simply, the
minimal-uiproperty allows you to display your responsive web page without the browser chrome taking up valuable screen real-estate.
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.
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.
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.
