iPhoney: Test Your Site for iPhone Compatibility

Matthew Magain

Can’t afford an iPhone (or don’t live in the US) but eager to check how your site might look on the hottest device of the moment?

Screenshot of sitepoint.com as viewed in the iPhoney application Enter the iPhoney: a small (1.3MB) desktop application that simulates web browsing on the newly released device.

iPhoney is not an iPhone simulator but instead is designed for web developers who want to create 320 by 480 (or 480 by 320) websites for use with iPhone. It gives you a canvas on which to test the visual quality of your designs.

This cleverly named app is a great tool for developers who want a rough idea of whether their site will be usable by the one million iPhone owners who signed up in the first six days. With sales like that, it’s conceivable that, within a few years, visitors browsing on an iPhone could amount to a significant percentage of your site’s visitors.

Sure, developers have always been able to resize their window to test how a site renders on smaller screens, but the beauty of this app is:

  • You can instruct it to send the iPhone User Agent string, in case the site you’re checking performs any content negotiation based on this string.
  • You can instruct it to disable plugins such as Flash and JavaScript, which aren’t yet supported by the iPhone.
  • You can quickly rotate the viewport, as you can on the real thing.
  • Resizing your browser just isn’t as much fun as loading up an iPhone look-alike on your screen.

iPhoney is only available for Mac at this point, although given the recent release of Safari for Windows, and the fact that the code has been open sourced, I imagine that a Windows port is not far off.

Ah, the beauty of having users who are passionate about your product — they’ll create stuff that supports and promotes it all on their own! I don’t know why phone companies don’t offer something like this as a free download — what better way to promote your phone, while at the same time providing a way for developers to ensure that the Web works as it should for more customers?

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • Tyssen

    Look forward to a Windows version being available soon but I’m wondering if using the Opera Mini demo would get you close enough in the interim? Usually if your site looks right in Opera, it’ll be pretty close in Safari so you’d think that if it looks OK in Opera Mini, it wouldn’t be too far out on the iPhone.

  • http://www.sitepoint.com AlexW

    Look forward to a Windows version being available soon but I’m wondering if using the Opera Mini demo would get you close enough in the interim? Usually if your site looks right in Opera, it’ll be pretty close in Safari so you’d think that if it looks OK in Opera Mini, it wouldn’t be too far out on the iPhone.

    I’d guess that Opera Mobile rather Opera Mini would be a closer match to how Safari on iPhone behaves. Opera mini pages are processed, stripped and compressed on the server before they make it client on your phone.

  • Tyssen

    Ah OK, but you can simulate Opera Mobile by selecting Shift + F11 within your normal desktop browser so maybe that’d be close?

  • http://www.sitepoint.com AlexW

    I’d think so. I know Opera Mobile supports the ‘handheld’ media type when it’s used, so I’d presume Shift F11 does the same on the full Opera Browser.

  • http://www.brothercake.com/ brothercake

    Yes, Opera in “small-screen rendering” mode uses handheld media CSS where available.

    Does Safari on the iphone use handheld media? Is it comparable with Safari on the desktop, or with any other mobile device?

    I hate to be a cynic, but unless the software accurately emulates the client environment, it’s basically useless.

  • http://www.webconxeon.com elemental70

    Will this work on linux?

  • http://www.rmwpublishing.net/ mountainash

    For a closer experience (than Opera) you can download the Safari beta (available for Mac and Windows) and try your site at http://iphonetester.com/

  • wads

    Dreamweaver CS3 has a system called Device Central which allows you to view your sites offline in any mobile phone that can surf the web, and it’s pretty accurate!

  • Tyssen

    Dreamweaver CS3 has a system called Device Central which allows you to view your sites offline in any mobile phone that can surf the web, and it’s pretty accurate!

    How accurate is ‘pretty accurate’ because I know the design view rendering of both DW and Contribute CS3 leaves a lot to be desired?

  • http://www.sitepoint.com AlexW

    How accurate is ‘pretty accurate’ because I know the design view rendering of both DW and Contribute CS3 leaves a lot to be desired?

    Device Central is a great concept but I’m bit skeptical. It has all the phone mockups and correct screensizes pre-programmed so if you’re just looking to size graphics or test navigation reainto but whether what you see in Device Central is exactly what the rendering engine in your phone would generate is maybe more questionable.

  • Anonymous

    This article is incorrect:

    “You can instruct it to disable plugins such as Flash and JavaScript, which aren’t yet supported by the iPhone.”

    While the iphone doesn’t support Flash or Java Applets, it does in fact support most Javascript.