Configuring Your App for the iOS Home Screen
You need to add a few more pieces to your game to let people save it to their home screen. The first is to add a meta tag indicating your game is “web-app-capable.” Users can save your game to the home screen regardless of whether your app marks itself as web-app-capable, but if you explicitly mark it as such, your app automatically loads in full-screen mode without the address bar or the button bar at the bottom of the page.
Making Your Game Web App Capable
To make your game web-app-capable, you need to add the following meta tag to the <head> of your document:
<meta name="apple-mobile-web-app-capable" content="yes">A second meta tag can make your app look more like a regular app when it launches. Mobile Safari uses a light gray status bar by default, but you can switch it to the standard black status bar by adding another meta tag:
<meta name="apple-mobile-web-app-status-bar-style" content="black" />Your options for the content of this meta tag are "default" that means to leave it gray; "black" that as described previously makes it the standard black status bar used by apps that leave the status bar on; and "black-translucent" that pushes your content up to the top of the page but leaves the status bar as semi-transparent over your content. For most cases, "black" is the best option unless you want a full 480 × 320 pixel area to play with, in which case you can use "black-translucent".
Adding a Startup Image
Apple gives you an additional ...
Get Professional HTML5 Mobile Game Development now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
