[Apple's iPhone Simulator] A tool to test/simulate your website on iPhone & iPad

Started by Xhanch Studio, May 05, 2011, 04:18:00 PM

previous topic - next topic
Go Down

Xhanch Studio

Designing websites that take advantage of the iPhone web environment requires more than simply designing for a smaller screen size. The iPhone automatically scales websites when needed. iPhone readers use multi-touch gestures to zoom or move around the page. Flash isn’t supported, and neither are larger animated GIFs (a surprise to me).



Tucked away in Apple’s free iPhone Software Development Kit is a terrific iPhone Simulator you can use to test and preview your websites. In the full version of this tip we’ll show you where that iPhone Simulator application is hidden, and include a few tips on how to test various iPhone features.

Download Apple’s Free iPhone SDK

Note: You’ll have to register for a free developer account and agree to Apple’s terms. Read on and we’ll show you where the iPhone Simulator application is hidden, and include a few tips on how to test various iPhone features.


Where is the iPhone Simulator application installed?

As important as the iPhone Simulator is, the actual application is surprisingly hard to track down.

The application is tucked away many folders deep in the newly installer Developer directory:

Developer/Platforms/iPhoneSimulator.platform/Developer/Applications/iPhone Simulator

Launch the iPhone Simulator app and wait for it to load. The only applications installed on this simulated iPhone are Photos, Contacts, and Safari. Launch the iPhone Safari web browser and start checking out websites.


How to use the iPhone Simulator?

Here are some quick guides to use this simulator:

  • [spoiler=Rotate your simulated iPhone]To rotate your iPhone, choose Hardware > Rotate Left, or Hardware > Rotate Right from the menu. iPhone’s Safari web browser will automatically rotate the website you are viewing.[/spoiler]

  • [spoiler=Pinch-to-zoom gestures]You can simulate the iPhones ‘pinch to zoom’ gesture by holding down the Option key while clicking and dragging with your mouse. This brings up a pair of dots that represent your fingertips.[/spoiler]

  • [spoiler=Double-tap gestures]Users can double-tap any part of a webpage to zoom in on that section. Simply double-click in the simulator to replicate this zoom. From testing, the iPhone’s zoom feature appears to be impacted by the DIV structure of your web layout. A useful detail to watch for if iPhone users are an important audience.[/spoiler]

Best Regards,
Susanto B.Sc
----------------------------------------------------------------------------
Web development services, WordPress plugin and theme development, PSD to XHTML conversion - http://xhanch.com
Read free manga online - http://authrone.com

Go Up