Sometimes you may want to save your mobile web app to the home screen of your iPhone/iPod with an icon. Normally for every app that you install iOS creates an icon with a glossy effect and rounded corners in the home screen, and then when you tap on the icon the app starts. Also each icon has a text below it that says the name of the app. For mobile web apps that run in the mobile browser we can do the same. We can save the app to the home screen and also add custom icon to it. In this post I will talk on how to do that.
For the demo I have chosen one of my apps (web application) and I will show you how to save it to the home screen. First launch the app in the mobile browser, I am talking of iPhone/iPod here so open your app in mobile safari. Then tap on the icon as shown in the image below,
It will open up an action sheet with all the buttons as shown below. Tap on Add to Home Screen button,