Below are the simple steps to simulate/view mobile version of a website on a desktop PC using Google Chrome browser.
You can simulate the mobile device dimensions including all iPhone models, Samsung and Blackberry phones. Also, you can add the view of any custom device if the phone you are looking is not available in the list.
Also Read : Record desktop screen with YouTube
Enabling Mobile view on Chrome
- Open the page on Google Chrome
- Press CTRL+SHIFT+I to switch to mobile view Note: You can use the same command to shift to desktop view.
- You will see mobile port view like shown in below figure. It displays height and width of the mobile port, zoom percentage, rotate (portrait or landscape view), online/offline settings.
- To view the device frame, click on More options , Click on ‘Show device frame’. Note: If you don’t see device frame for any particular device, Google might not yet added the frame for that device.
- Click on responsive drop-down arrow and select the mobile device. Please note that it provides the view, but it is not exactly the view that you see on your mobile. It has limitations. You can click on Edit… button to get list of more mobile devices (sizes). Below is the example with iPhone 6/7/8 plus devices.
Source: https://developers.google.com/web/tools/chrome-devtools/device-mode/
