Preview Your Mobile Website in Chrome

Studies show that 52.2% of all web traffic came from mobile devices in 2018. Given that the majority of your customers could be viewing your site from a mobile device, it has never been more important to ensure that your site has been optimized for mobile devices.

For #TipTuesday this week, we’re going to show you how to preview what your mobile site looks like by using Google Chrome on your desktop computer.

Step 1:
Open up Google Chrome on your computer and navigate to your website.

Step 2:
Open Chrome’s developer tools by pressing F12 or opening the Chrome menu at the top right of your browser then select More Tools > Developer Tools.

Step 3:
Click the ‘Toggle device toolbar’ icon on the top left of the interface to turn device mode on or off. The icon should turn blue if it’s been activated.

Step 4:
If you would like, you can now select which mobile device you want to simulate by clicking the drop down menu where it says ‘Responsive’ at the top.

Step 5:
Refresh the webpage with device mode to allow the mobile version of the site to load.

Shazam! You’ve got a mobile preview of your website so you can see how your website looks on mobile devices. This is a great way to ensure your website is responsive for mobile devices and to check any changes you have made are working.

#KonstructDigital #WebDevelopment #MobileOptimization
#MobileFirst #DeveloperTools

Posted on Instagram:

Learn something new? Share it with a friend