Developing mobile website

Although a lot of website are using a responsive design which just scales the content, when you browse them from a smaller resolution (like tablet or smartphone). Some still choose to have a special mobile website.

These can be tricky to test, as you normally would have to be able to access your development environment with your phone or tablet - and then as with the old rendering conflict between IE and all the others - how does it look on another device? Say I have an old iPhone 3. How do I test what it looks like on a Samsung Galaxy S5 or iPhone 6? And how about tablets? Well you could go out and by all the various devices, but that's both expensive and unrealistic. So what to do?

Well actually I just stumbled on a pretty easy an much cheaper solution - it's actually free! Google Chrome has a build in test tool that faces this exact problem! It cannot only emulate a large variety of devices, but also various network connections.

I won't go make a guide here, since the developers already made one that you can find here: https://developer.chrome.com/devtools/docs/device-mode

Happy coding!
Posted on Thursday, January 22, 2015 10:08 AM CSS , mobile , web development , debugging , emulator , phone , chrome , google | Back to top