Help on website optimization for iPhone

Question

We re trying to work on making a mobile version for one of our asp.net web applications, however we would like to make iPhone specific.

Are there any resources out there which provide best practice guidelines:

• UI Guidelines, any .net control libraries which are iPhone specific.
• Security guidelines - anything special that the iPhone Browser (mobile safari) has.
• Usability Guidelines - navigation tips, button sizes, etc.

Anything else which will help us put together an app which looks native to iPhone.

Answer 1

You could check out this tutorial on css-tricks.com: #38: Basics & Tips on Designing for the iPhone

Answer 2

Apple has a Web Apps Dev Center (free ADC account required).

Also, recent versions of DashCode have built-in templates for iPhones websites. Some of those resources might be applicable.

Answer 3

I forgot to mention, iUI is a neat little CSS and JavaScript bundle specifically targetted at iPhone web apps. It will probably save you a lot of time.

Answer 4

There are a couple of good articles on A List Apart:

• Put Your Content In My Pocket
• Your Content In My Pocket, Part II

Also, Apple have the Safari Web Content Guide which has lots of valulable information on configuring the Viewport when designing web content for the iPhone.

Answer 5

Here are some design-resources:

• Tutorialblog's list of resources
• Mashable's list of resources

Also, I think facebook open-sourced the javascript-API they built to make iphone.facebook.com, but I can't find it at the moment..

Answer 6

Shameless plug: Optimizing Your Website for Mobile Safari