Last week at the WWDC the iPhone was discussed during one of the developer discussions. The information discussed gives us further insight into the capabilities of the phone.
Here is a listing of the notes gathered by the University of Washington's Emerging Technology Group:
Features of the iPhone that can be utilized by websites:
- the page view feature lets you look at multiple websites and documents by scrolling thru them one after another
- Full PDF support
- double tap for zoom in
- one finger as a mouse used to
-- pan page
-- press and hold to display the information bubble
- two fingers as a mouse used to
-- pinch content to shrink - zoom out
-- pan page
-- scroll wheel events
- new telephone links allows you to integrate phone calls directly from your webpage. remember this is only on safari.
- built in google maps client for integrated mapping from your website
Limitations of the iPhone include the following :
- 10MB max html size for web page
- Javascript limited to 5 seconds run time
- Javascript allocations limited to 10MB
- 8 documents maximum loaded on the iPhone due to page view limitations
- Quicktime used for audio and video
The following are some guidelines that Apple recommends developers to follow when writing for the iPhone:
- separate html and css
- use well structured and valid html
- size images appropriately dont rely on browser scaling
- tile small images in backgrounds, dont use large backgroung images
- iPhone supports both EDGE and WiFi. EDGE pipe is smaller than WIFI pipe so think about bandwidth when developing.
- XHTML mobile documents supported
- stylesheet device width:480px
- apply different css for the iPhone. For example displaying a one column page for iphone vs a 3 column page on a desktop.
- there are no scroll bars or resize knobs. the iphone will automatically expand the content
- Avoid framesets, scrollable frames are automatically expanded to fit the content
- iPhone User Agent: Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A538a Safari/419.3
- Video: H.264 baseline profile level 3.0 up to 640¡¿480 fps
The details are pretty self-explanitory, though one that I would like to point out that may cause some confusion is the limitation of a Javascript to only 5 seconds. From what I understand, this is not a big limitation as most Javascripts only take less than a second to run. For comparison, the default time limit on Firefox for a Javascript is 10 seconds. These limitations are in place to prevent your browser from crashing in the event that the Javascript gets caught in a loop.
There were other details mentioned that were not included in the above lists. The biggest being the fact that the iPhone will not support Flash or Java. I will say that this is disheartening, but not unexpected. The use of Flash and Java would put a strain on the processor, not the kind of strain that the iPhone couldn't handle, but rather the kind that eats away at your battery life. Also, if they were to allow you to use Java on your iPhone, it would become a gateway to installing software on the iPhone, which we already know Apple is not fond of.
So if you're looking to design websites for the iPhone, those are the guidelines to follow. I don't design websites, but I'm sure that plenty of you out there do, so enjoy!
iPhone Browser Capabilities and Guidelines [via macrumors]
