Apple Developer Connection: Web Development guidelines for iPhone

Apple has provided guidelines on how to optimize web applications and content for the iPhone at the Apple Developer Connection (ADC) which is the centerpiece of the Apple's developer community.

So if you were looking to develop something for the iPhone, please find details after the jump.

Understand User-iPhone Interaction

This was the information available at ADC "Safari on iPhone uses the same Web Kit engine as Safari on the computer desktop. With the Safari Web Kit engine, you can develop sophisticated Web 2.0 sites and applications that will impress and delight iPhone users. To design a web application that shines on iPhone and ensures a great user experience, you’ll want to:

• Understand the capabilities of iPhone.
• Follow established design practices for the web.
• Adopt iPhone-specific design principles.

The following guidelines will help you prepare web content and design a website or web-based application for iPhone. If you are a seasoned web developer, there are probably just a few refinements you can make to ensure that your site looks great and works best on iPhone. You’ll need to read only those guidelines that are unique to iPhone. If you are fairly new to web development, you’ll want to make sure that you understand web standards and established web design best practices before following any iPhone-specific guidelines.

• Understand User-iPhone Interaction:  It’s tempting to think that using an iPhone is like using a computer. But it isn’t. There are a few differences that make user interaction with iPhone unique and that you’ll want to keep in mind as you design web content according to the guidelines described throughout this document.

• Use Standards and Tried-and-True Design Practices:  The first design rules for web applications on iPhone are to stick with web standards and follow established web design practices. Standards-based web development techniques ensure the most consistent presentation and functionality across all modern browsers, including Safari on iPhone. A well-designed website will probably require just a few refinements to look good and work well on iPhone.

• Integrate with Phone, Mail, and Maps: iPhone telephone links.Maps use built-in Google client.Safari on iPhone can seamlessly integrate with other iPhone applications to provide a rich user experience.

• Optimize for Page Readability: By following some simple strategies for laying out content, adjusting text size, optimizing images, and the like, you can make your web application look great and perform well on iPhone. The Safari user agent string for iPhone is similar to the user agent string for Safari on the other platforms except for two differences: it contains an iPhone platform name and the mobile version number.

• Ensure a Great Audio and Video Experience: iPhone streams movies and audio using HTTP over EDGE and Wi-Fi networks.

• Know What Safari Supports on iPhone: While Safari on iPhone uses the same Web Kit engine as Safari on the computer desktop, iPhone has unique user interaction features appropriate for a portable device. You need to work within the feature set available with Safari on iPhone, and you should provide work-arounds for Safari features unavailable on iPhone.

• Connect With Web Developers: Learn more about the World Wide Web Consortium, the Web Hypertext Application Technology Group and HTML5:
  
      * http://www.w3.org/html/wg/
      * http://www.whatwg.org/"

A few web applications have already been released for the iPhone, but development primarily has been by trial and error basis for these early iPhone applications. Hopefully these guidelines helps developers churn whole host of iPhone applications which will help us do things currently not possible on the iPhone however without the SDK, I would imagine that the application features would be limited.

[information and image courtesy Apple]