updated: January 9th, 2007 / Ross Johnson / 18 Comments

Ways to test your site for the mobile web

The buzz about the future of the mobile web is almost defining. Even though the mobile tsunami has not hit the web yet, it is better to be prepared for when it does crash down on us, rather than trying to swim to the surface after it does. While I wouldn’t necessarily start creating a mobile specific version of your site, but simply ensure that relevant content can be found on a mobile device.

Need a pretty universal example? I had a client that was supposed to come to my office for a meeting, but had trouble locating it. If I had a map on my site that was mobile accessible, they could have simply followed it rather than looking up my address and hoping to google maps.

So the best way to find out the “mobile ready” level of your site is through basic testing. However that is much easier said than done, as even the most phone savy users doubtfully have access to more than a handful of mobile devices to test with and there are over 40 mobile browsers and 160 devices.

The solution? Test as far as you can reach!

Unstyled

The first easy way to test your site for mobile devices is simply to remove the style sheet. Many older phones still render un-styled raw HTML. The good thing is that if your site is build using semantics and web standards, this should be the easiest platform to test and adapt too. This can be done through firefox by going to “View > Page Style > No Style”

Resize Your Browser

Simple yet effective, resizing your browser gives you a good idea of how your site would look in a modern phone that supports style sheets. If you have FireFox and the developer toolbar you can simply go to “resize > Resize window” and enter the width you would like to test for. Here are some common resolutions for hand held devices.

  • 176 x 208
  • 240 x 160
  • 320 x 240

OperaMini/OperaMobile

Opera has developed a mobile browser with an amazing technology called “Small-Screen Rendering.” While not all phones are supported and it is not currently pre-installed on any phones that I am aware of, it works so well that you can be sure you will be seeing and hearing more about it in the future.

Luckily it is quite easy to test for OperaMini, simply download Opera and go to the page you wish to test. Hitting SHIFT + F11 will render the page as if it were on an OperaMini browser.

Emulators

Once you have exhausted the phones you can borrow to test with, it is time to resort to emulators. Luckily many mobile browsers have windows emulators for improved testing.

There are several good resources to get you started, hopefully as you tweak your site to render properly in the browsers you can test for it will become more compatible for those you can’t.

18 thoughts Ways to test your site for the mobile web

  1. Nice article, I think web development for mobiles is an important issue, and as many people have already started to say, 2007 is going to be the year of mobile web browsing.

    I think with the release of Apple’s iPhone during Q2 (think they said around June) it might help spark more interest. True, the iPhone is probably not the most ideal of examples due to it’s full blown browser, I’d hope it still has a way of being identified as a browser on a mobile phone.

    By the way, nice site, I really like your design! Top job.

  2. Thank you David, and I agree. I think the iPhone is what is going to start making mobile browsing “mainstream.”

    Between the iPhone and phones equipped with the Opera browser users should be able to find some pretty interesting uses for mobile web browsing which will no doubt shape how we design for it.

    Beyond some basic cross-uses, I think the mobile device experience is going to be very different than standard mobile web.

    ross
  3. Pingback: Web-Sites of the Month: The Best of January 2007 | Smashing Magazine

  4. Pingback: Mark Kirby - Brighton » Blog Archive » links for 2007-02-07

  5. Pingback: 煎蛋 » 2007 年一月最佳网站收集

  6. I’m interest with web in mobile phone. And this is great article for me. Thank you

  7. Pingback: links for 2007-02-13 - mattherzberger.com

  8. Pingback: Web móvel - Dicas e truques - Klaus Paiva - Blog

  9. Yeah , Soon many people will start moving from a notebook to a windows mobile which enables them to access world from their hand.
    I recenly saw many touch screen coming up.
    It is better to get ready for the future.

  10. Pingback: Good websites that you shouldn’t have missed | TechBlogy

  11. I think what you wrote at the beginning of the year, that’s already happening right now. You said it right.

  12. how mobile testing is done?

    amit topkar
  13. Your fourth link in the 5 list above is not working anymore

    steve
  14. Interesting information. I just downloaded Opera_9.25_Eng_Setup.exe and now I am on my way. Thanks for this information.

  15. Pingback: Internet users are going mobile: Are you also? | Aleyda Solis Blog | Web Enthusiast, Developer and Promoter

  16. Pingback: Los usuarios de Internet se hacen móviles: ¿Tu también? | Aleyda Solis Blog | Entusiasta, Desarrolladora y Promotora Web

  17. nice site, I think the mobile device experience is going to be very different than standard mobile web. many people have already started to say, 2007 is going to be the year of mobile web browsing. It is better to get ready for the future.
    ============================================
    julee
    mobile phone recycling

    julee
  18. Hello

    I work for the company Siruna, which is located in Belgium. We create mobile websites which work and fit in the screen on any mobile phone and with any mobile browser. Our technology uses your own desktop website to make your mobile website.

    Feel free to comment

    Kim

    Check out our website: http://www.siruna.com

Comments are closed.

FREE CASE STUDY: 100% INCREASE IN LEADSHow we increased our clients leads by 1000% by using design psychology

Using a process that anyone can use for any industry