Posted June 4, 2007 6:31 pm by with 9 comments

Tweet about this on TwitterShare on LinkedInShare on Google+Share on FacebookBuffer this page

Only 25 days to go til the iPhone is available! I’m excited about the launch of this new Apple product not because I’m an Apple junkie, but rather I truly believe that the iPhone’s design may help increase mobile web usage in the U.S. However, it may also create a slight challenge for web designers — how do you design for this new hardware?

Until now, most of us have been restrained to the micro screens of the Treo and Blackberry when accessing websites via our mobile phones. While some website owners have begun to prepare for the mobile web and have created specially-designed mobile versions of their website, others have not, making many web searches frustrating as users attempt to view an 800×600 website design on a tiny 168×168 pixel screen (approximately). But the iPhone is poised to change all of that.

The iPhone boasts a 3.5″ wide screen (when turned to view in landscape mode) — essentially a 336 pixels wide viewing area — DOUBLE what I have on my Treo today.

But before you go calling this a mobile web watershed moment, let me explain the problem that arises from the iPhone’s design. The iPhone will display the entire page of a website in its 3.5″ wide screen, allowing users to zoom in on specific areas. This means that a website designed for an 800×600 display will be shrunk by more than 50% to appear on the iPhone display. On the other hand, current mobile phones on the market simply “cut off” or force a website into the small screen format. Many companies have created specific mobile versions of their sites to make them easier to view on a Treo or Blackberry and fit the small screen format: Mobile Website

And while the new iPhone approach may be more user-friendly for some, it creates an immedite issue for webmasters — should you create an iPhone version of your website? Take for example how the website would appear on the iPhone: Website

It will be interesting to test how a website created for the 3.5″ wide format of the iPhone vs. using an existing website created for 800×600 or higher, which will involve zooming by the user. Will zooming follow the three-click rule? The more times someone has to zoom in, will they by more likely to abandon? It’s a whole new challenge for web designers — but one that I think will lead to some interesting data about mobile users in the coming months.

  • Wow. I hadn’t realised the launch is so soon. Can’t wait really! I wonder if it’s still on schedule.

  • This is really good info. Thanks for the tip!

  • Just checked. According to Reuters, the selling date has been confirmed, especially as Apple is running ad campaigns with the date. Woohoo!

  • It takes so long… I ont understand the fuzz arround. Usualy when something is anounced than people are disapointed because something better from other company comes sooner and is better and cheaper.

  • I see so many people now asking if it’s ok to forget about 800×600 and move up to 1024×768 when designing. I think instead we’re all going to have to think about lower resolutions and smaller screen sizes again.

    And of course each mobile device will be somewhat different in how it renders a page.

    The iPhone does look good. I wonder how people will respond to a virtual keyboard and how well the first generation of the iPhone will work.

  • This reminds me of an early consulting project I was on. We saw from the client’s web data that people were browsing their site using these odd sized, small screens. It was their browsing patterns that explained what was going on. We decided to create an all-text site to accomodate them and business went up. This was years ago, though. Nothing new under the sun, yes?

  • Pingback: Speed Linking Volume 2 at effective web ministry notes()

  • Pingback: Adventures in Email Marketing » Email Design for iPhones |()

  • Kinda nicely written actually. 🙂

    dekor’s last blog post..Ny bildekor till demobil