The first step in optimizing web content for iPhone is to separate your iPhone-specific content from your desktop content.
Use conditional CSS so that you can create iPhone-specific style sheets as described in “Using Conditional CSS.” You can also use object detection and Web Kit detection as described in “Follow Good Web Design Practices” to use extensions but remain browser-independent. Only if necessary, use the user agent string as described in “Using the Safari on iPhone User Agent String” to detect Safari on iPhone.
After optimizing your content, read the rest of the chapters in this document to learn how to set viewport properties, adjust text size, lay out forms, handle events, use iPhone application links, and export media for iPhone. Finally read “Debugging” for how to debug your webpages on iPhone.
Last updated: 2008-02-05