iOS ‘native’ web apps with HTML5

I’ve been considering iOS development recently but I don’t have a Mac on which to develop. Alternatively, I have been looking into HTML5 ‘native’ web apps. These are web apps that look and feel like native iOS applications.

I am using my Batch Image Resize web app for my R&D on this topic.


The web app can be installed via Safari’s ‘Add to Home Page’ feature.

It looks like a native App

As per the Apple Developer Guide, adding the elements below will allow the site to act like a native app when access from your iOS device.

‘apple-touch-icon’ defines the image to use for the icon.

‘apple-touch-startup-image’ defines the splash screen image.

The ‘apple-mobile-web-app-capable’ meta tag allows the page opened via your home screen to behave like a native app. When I open the ‘app’, I see it in full screen browser with no address bar at the top or any of the menus at the bottom.

<link rel="apple-touch-icon" href="/path/to/custom-icon.png"></link>
<link rel="apple-touch-icon-precompsed" href="/path/to/custom-icon.png"></link>
<link rel="apple-touch-startup-image" href="/path/to/startup-image.png"></link>
<meta name="apple-mobile-web-app-capable" content="yes"> <!-- Full Screen --></meta>