Getting Started with iPhone Web Apps
An iPhone web application—or iPhone web app—uses Web 2.0 technologies to deliver a focused solution that looks and behaves like a built-in iPhone application. iPhone web apps run in Safari on iPhone, the unique implementation of Safari that provides full-featured web browsing on iPhone OS–based devices and responds to touch-based gestures.
To develop a great iPhone web app you need to:
Optimize your web content for Safari on iPhone
Design a user experience and user interface that follows Apple’s guidelines
Choose next how you want to get started—by reading about the basics, getting your hands on some code, or diving into specific technologies.
Want to get familiar with the fundamentals?
“Design for Your Users” in iPhone Human Interface Guidelines for Web Applications and Metrics, Layout Guidelines, and Tips introduce many of the user experience and user interface guidelines that govern great iPhone web apps.
Prefer to learn by doing?
Web Application Tutorial walks you through using Dashcode to create a simple web application you can run in Safari on iPhone.
Simple Browser is a sample project you can use to find out how to develop a productivity style iPhone web app (the built-in iPhone Settings application is an example of this style).
CardFlip is a sample project you can use to find out how to implement the back-to-front flip most utility style iPhone web apps perform (the built-in iPhone Weather application is an example of this style).
Want to find out how Safari on iPhone supports the web technologies you use?
Safari HTML Reference describes the HTML elements and attributes you can use in Safari on iPhone.
Safari CSS Reference describes the CSS properties Safari on iPhone supports.
Go In Depth
Sometimes you need task-focused information or answers to specific questions to get started. Browse the popular tasks described below for a more targeted way to start development on your iPhone web app.
Use visual effects to add richness to your iPhone web app. Safari CSS Visual Effects Guide describes how to use CSS properties to implement stunning visual effects in your iPhone web app without resorting to static images, Flash, or Dynamic HTML.
Take advantage of the Multi-Touch interface to allow users to tap, flick, and drag content in your iPhone web app. “Handling Multi-Touch Events” in Safari Web Content Guide describes how to register for and respond to these multi-touch events; Safari DOM Extensions Reference documents the WebKit DOM extensions that support them.
Add links to built-in iPhone applications to make your iPhone web app feel more integrated with users’ devices. Apple URL Scheme Reference describes how to add links that open Phone, Maps, iTunes, and more.