During the last few years there has been no shortage of devices being released to the market. For us this was a new challenge and we all stepped up to the plate by adding device specific media queries to our stylesheets.
This was possible in “the good old days”…
A few years has past and we have come to the realisation that adding device specific media queries is completely bogus and unmaintainable (well I hope so). Rather, focusing on how the design looks across any size has become the norm.
But with this approach, how do we really know that our site looks “correct” on X device?
a) We go and buy / borrow every device that is required and test.
b) Visit your local device lab and test.
c) Open up Chrome and do the following:
Pop the Chrome Developer Tools up with command + option + i.
Press the Esc key or click the draw icon (top right) and navigate to the Emulation tab.
Then select the device of your choice (currently 43!) and Emulate.
The awesome thing with emulating your site in Chrome is that you have all the power of the Developer Tools right at your finger tips. This makes debugging pretty painless.
A word of warning. Emulating your site in Chrome is by no means an accurate representation of how things will look and behave. Testing on the real thing will always be the best. That being said, the emulation feature sure is an amazing developer resource which should be utilised to speed up mobile development.
Thanks for the info on the Chrome Dev Tools Emulation.
Just wondering if this is a known issue/bug or not but I can get websites to load and scroll them but I can’t click on anything?
Is that how its supposed to work or not?
Thanks.
You should be able to fully interact with it.
Sounds like something strange is happening either your end or with the website that is being emulated.
If you feel that it is an actually bug I’m sure the Chrome team will have no issues looking into it. Here is the link to file an issue – Chromium Issues.
Hope that helps.
Must be my browser because it happened on every site I tried.
Thanks for the info.
I will reinstall and see if works properly.
Hi B. Moore, I noticed that after I picked my emulation environment, I had to refresh the page for the site to recognise the new environment.