iPhones and mobile media

The launch of the new iPhone has made me really think abut handheld and mobile design again. Although not being launched until later in the year over here in the UK, I’ve been researching what changes I may need to make in designing sites to adapt to the iPhone. Later in this article, I’ll mention about how non-profits should also be thinking about mobile technology for communicating their cause. It goes hand in hand together, me the designer creating their site, and the organisations themselves thinking about how they can effectively communicate with their users in another media.

  • Will it be all hype? (I remember when the news of the iPod was being launched and many mocked it, now nearly everyone in the universe has one) (erm…except me!).
  • Will we turn to a nation using the internet on our phones more and more? And how many of the sites that I design for are likely to have many users using mobiles and iPhones to view their site? My core design work essentially focusses on small rural organisations here in Devon
  • Well, at this moment in time, very few (maybe that’s partly due to lack of reception in some areas, or just the rurality where we aren’t using mobile technology as in depth yet as our urban counterparts?). Saying that though, if I was designing a site for a youth support and advice project, I would need to ensure that it works as good as even if not better on a mobile device rather than just desktop browsing .
    Plus, as part of usability and accessibility to all, all my designs should work on any mobile device and other medium effectively to give the user a good experience.

    When testing new sites and designs, I test on a wide range of platforms and browsers and different machines to evaluate how the site will work. Firefox, Internet Explorer, Konqueror, Safari and Opera are the main ones that I test on plus a few others. Before I moved over to Mac, I used Browsercamp to get a screenshot of pages in Safari.
    For handheld previewing, I also love using the Opera mini demo within the Opera browser to test how sites can be viewed on a mobile using the excellent Opera mini.

    So more about the iPhone, a new combination phone, iPod and internet communications device, in fact it looks like it will be a fab gadget and no doubt the ‘must have’ item on many peoples Christmas wish lists this year. (and yes, I really don’t need one, like I don’t need an iPod, but if Santa popped one into my stocking I wouldn’t moan!). The iPhone version of Safari is (no surprise) based on a version of WebKit. It features a full, scaled and zoomable Safari / WebKit based browser which runs on the small screen either landscape or vertically. (That part to me is really cool!) Very exciting too with it’s touch screen interaction.
    So, how do I prepare to design my CSS and sites to interact for a beautiful browsing experience on the iPhone then? Thankfully there is a great demo site (which really works best in Safari!) which will help you to see what your site will look like on an iPhone. View and test your site here on an iPhone at – www.iphonetester.com.
    Also, the Apple team have produced some excellent material for developers to be able to design for the Iphone, and alot of what is there is really useful as a resource for other mobile / handheld browsing too for web developers designing their stylesheets for these devices. See their pages here at the Apple Developer Connection.

    What’s really opened my eyes here with recent advances in development is that we may soon see the end of the “mobile web” as this well founded separate concept. When you see the adverts and marketing of the iPhone (although it doesn’t make the tea!) with it’s unsurpassed browsing experience, as well as other products out there like Nokia’s S60 Browser (based on WebKit) and the number of higher-end phones featuring Opera, you being to see how finally, mobile browsing is moving on at a great pace.
    Increasingly, you can browse the real web on a phone and have a high quality experience. (maybe I will start using the mobile web more in the future myself…). The need is being reduced for a creating a WAP ‘boring’ version stylesheet when designing for the web just for mobile devices; (I sometimes use this site as a mobile demo to test sites with – http://emulator.mtld.mobi/emulator.php – compare that with Opera Mini or the iPhone!) instead we can have a single device-independent web that’s presented in the best possible way on a variety of devices. Another neat little browser for mobile technology which is developing well is the MiniMo, although not seeing many using that at present.

    So how do we entwine these developments of mobile technology to the non-profit / voluntary and community sector where I support and enthuse groups about effective technology as a circuit rider? Alot of the groups I support are still in the very early days of communicating their cause via the web, and aren’t ready or able to jump into Web2.0 world just yet. But is has struck me that I need to be out there testing and working with mobile technology more to be able to raise the bar for these groups and enable them to move forward when they are ready.
    I’d been looking into the iPhone for a day or two now, to look at how I may need to tweak some of my design work to work best on one, when today as I was writing this, spotted on NTEN’s blog, a great article on non profit mobile technology. Read it here at: http://nten.org/blog/2007/07/12/guttenberg-would-be-a-mobile-blogger-mobile-phones-as-mass-media

    It’s a great article which led me to follow the links to the excellent articles of media by Robin Good with mobiles being the 7th media. Do have a read, a really good summary of the history of media. And really timely for me looking at the shifting landscape of mobile browsing and interactivity and how it can be used not only for my web design but also in the context of non-profits communicating with their users.