We have been talking about how important it is to have your website working properly on a mobile. But it isn't always convenient to physically check your mobile - and what about other makes of mobile or operating systems?  
There is another way using your browser and desktop... 
Check how your website looks on a mobile
Firefox browser
I like to use Chrome and Firefox on my desktop and Safari on my laptop. I like the extra functionality these browsers give, which helps me when looking at (lots of!) websites, quickly and easily. But did you know that there are options within these browsers to see how websites will look like on different devices/screen sizes and test if they are responsive? 
Firefox: Press Ctrl, Shift and M (at the same time). You then select the appropriate screen size from a drop down menu. 
Firefox showing a mobile version of a website
Google Chrome
Chrome: Press F12, this will open a box to your right and at the top left of this box there is a phone symbol (next to the arrow). Click this device symbol and then the website size will change. You can then select your device from the drop down menu at the top, i.e. iPhone 6, Samsung Galaxy etc. 
Chrome is my preferred choice as you can select a named device, shown in the screen shot below: 
Google Chrome screen shot showing options for showing different devices
Tagged as: Tips and Tricks
Share this post:

Leave a comment: