View website as mobile from desktop

Question

I'm developing a mobile version of my site and I don't have my mobile phone with me to view my changes. How can I mimic mobile view on a desktop for development? I tried http://iphone-emulator.org/, but It doesn't change my User-Agent to mobile. I'm on a Mac.

Answer 1

If you want to view the effects of multiple user-agents at once you can try http://prism.mobiforge.com. It shows an iframe for each mobile device, using the correct user-agent string for each one. It's a handy check, but not a way to test the actual rendering on real devices, as AsTeR notes.

It also shows the overall page weight in each case, which can be useful.

Answer 2

The easiest and quickest way to get an idea of your mobile web app is with Chrome:

Settings -> Tools -> Developer Tools -> Settings (right site bottom) -> User agent (in Tab menu) -> "Override User Agent"

Remember: the results of ANY emulator should be verified by real mobile devices on regular basis.

Answer 3

If you are on a mac you can download the iOS SDK which embed a simulator. You can also find an emulator inside the Android SDK.

EDIT : faking the user agent is a false solution since you don't have the exact rendering engine than you have one device.

EDIT2 : if you're starting mobile device development one advice : beware of blackberries (the old versions of the OS embed the IE6 of mobile)

Answer 4

Using "User Agent Changer" for Firefox...

Set Developer option under Safari. Development->Change User Agent

Answer 5

You can use the emulator that Android offers.