How to view the mobile version of any website on your computer

Have you ever wondered what the website you visit every day while working in front of your computer screen would look like in mobile view?

With the popularity of smartphones today, you can easily solve the above question by taking out your phone and accessing that website. However, in case you want to view the mobile version of any website right on your computer browser, what should you do?

Below are a few simple steps so you can access the mobile version of any website right on your desktop environment. This guide applies to Google Chrome and Microsoft Edge (new) - the two most commonly used web browser platforms in the world today.

Steps:

Step 1: Open your computer and visit the website you want to view in mobile mode on Chrome or Edge. We chose Chrome for this tutorial, but the steps will be similar on Edge. Once the page has loaded, press the F12 button to open the developer tools window.

Step 2: Once the developer tools window has opened, look for the device switching button with an icon that resembles a phone and a tablet (as highlighted in the illustration below). below), and click that button.

Step 3: You can click the ' Responsive ' button to select the specific device model you want to emulate. A drop-down menu will appear, listing the names of several mobile devices that you can choose from. Additionally, you can also customize the resolution of the simulated website to suit your needs.

It's convenient, right? Based on the features available on Google Chrome or Microsoft Edge, we can comfortably check the website's display on mobile phones and tablets without the need for external support devices. Good luck !

Kareem Winters

Update 26 July 2024