You can view the mobile version of any website on your desktop using Google Chrome. This article explains how to use Chrome’s built-in developer tool to view mobile versions of websites.
Mobile Version of Websites
Before I show you how to use the built-in Chrome Developer Tools, here is an easier method.
mobiReady is an online tool to test mobile versions of websites. Open a new tab and go to https://ready.mobi/. Enter the website address and click Go.
mobiReady displays the mobile version of the address you entered.
Using Developer Tools
To view the mobile version of a website using Chrome’s Developer Tools:
- Open the website on a new tab and press F12 on your keyboard. You can also right-click on anywhere on the webpage and select Inspect.
- On the inspect element toolbar, select the Toggle Device icon.
- You will now see the mobile version of the website. You can click the same icon again to go back to the desktop version of the website.
- Select a device name from the Responsive drop-down to test how the website looks on different phones and tablets.
- Use the fields next to the Responsive drop-down to enter your custom screen dimensions.
I hope you found this tutorial useful. Ask your questions in the comments form below and I’ll do my best to answer them.