How do I develope webpages for the iphone that look like native apps?

Question

If you look at some google pages (ie. mail.google.com/tasks) on the iphone they look a lot like native iphone apps. Does anyone know how they got it to mimic the look of the native apps and is there a resource that describes how to do it?

Also does one have access to any of the iphone hardware data ( ie. accelerometer data, gps information ) from the javascript on the clients safari browser? I imagine not but I thought I would ask anyway.

Answer 1

A Google search for "HTML iphone" yields heaps of answers. You need to pay close attention to the conditional HTML for the iphone. This article seems to cover a lot of information needed for the look/feel: iphone-development-12-tips

I also stumbled across an API that might be of some use: http://code.google.com/p/iui. They have some live demos:

• Music Example
• Digg Mockup

Answer 2

This article talks about how you can make your website iPhone friendly : http://www.hanselman.com/blog/MakeYourWebsiteMobileAndIPhoneFriendlyAddHomeScreenIPhoneIconsAndAdjustTheViewPort.aspx

To answer your second question I would like to direct you towards "Phonegap" (http://phonegap.com/) which is an open source development tool for building fast, easy mobile apps with JavaScript and supports accessing geolocation and accelerometer data for the iPhone.