Skip to content

How to Enable Mobile Site View in Chrome Computer?

For the page developer, it is very crucial to check whether the site fits the Mobile Site view or not. The best way to check this in Chrome Computer is through the Developers tools. For this, you need to launch the site and then tap on the three dots at the top right corner of the screen. Next, you need to open more tools and tap on developer tools. You will find a device toggle icon on the left side of the Elements option there, tap on it and you will be able to see the mobile view site.

If you’re a developer and want to view the mobile site view on a desktop computer browser like Google Chrome then you can use the below tip. This can help you quickly switch your site look from desktop to mobile and test the front-end look and feel.

Google Chrome has an in-built developer tool console that allows the switch between mobile sites and desktop sites easily without any developer extensions. It has preset device options that you can select from the drop-down and change the screen size.

A week back, my brother was working on a gaming website of his own when he asked for my help. He wanted to see the look and feel of the website on a mobile device while he was working on his computer. The google chrome view mobile site was the only solution!

Related: How to View Full Desktop Site on Chrome Android Phone?

You can also choose the responsive mode and resize the screen width to test the responsiveness of the website over different screen sizes. Chrome will give a perfect mobile and navigation experience from the desktop browser after we enable mobile view in chrome!

How to View Mobile Site in Chrome Computer?

The mobile site view is often used by developers when testing and launching a new website design. It helps in checking the compatibility of the website and also user experience when visiting on small screens. After you enable mobile view in chrome, you can view the website in mobile site view.

Here are the steps on how to enable mobile view in chrome on any computer device:

  1. Launch the Google Chrome computer browser.
  2. Open the website that you want to view on the mobile site.
  3. Click on vertical 3dots icon menu for options.
  4. Hover on the More Tools option from the list.
  5. Select Developer Tools under the More Tools menu.
    Launch Developer Tools in Chrome Computer
  6. This will launch the Developer Tools pane in the browser.
  7. Click on the Device toggle icon to enable the mobile site view mode.

Mobile Site view mode in Google Chrome on Computer

This will load the mobile site user interface. You can also choose the make and model of the device from the dropdown menu to select the desired device experience.

Once you close the developer tools console, the website will reload back as a desktop site. If we view the mobile sites on desktop chrome, it will help you analyze the look and feel of the website better!

Bottom Line: Chrome Computer Mobile Responsive Site

The mobile responsive site feature within developer tools helps in testing and developing a mobile site without using small-screen devices. You do not have to switch devices to view the site design. Using the responsive mode, you can drag to control the various screen sizes.

When I design or make any changes on the front-end part of this blog, I usually look at the effects of changes on a desktop, tablet, and mobile screen using the above tip. It helps in making sure that everything is in-line, and design changes are visually appealing. I advised the same to my brother. Now, he knows how to enable mobile view in chrome to test the interface of his gaming website.

Similarly, you can also request a desktop site view on the chrome android browser. It does not have any developer options but it can be useful when you need the full site experience on small screens.

What do you think about the mobile site view under developer tools for chrome computers? Isn’t it helpful? Let us know.

FAQs: Enable Mobile Site View in Chrome Computer

How to enable the Mobile Site View in Chrome Computer?

To enable the mobile Site View in Chrome Computer, firstly launch the site and then tap on three dots at the corner, next open the more tools option. Now, open Developers Tools and tap on the Device toggle icon on the left side of the Element option.

How to get back to the Desktop view in Chrome Computer?

As soon as you return back from the developer’s tools, the site returns back to the desktop view in Chrome Computer.

How to select the elements of the page in the Mobile Site View in Chrome Computer?

To select the elements of the Page in the Mobile Site View on the Chrome Computer, you need to tap on the icon left side of the device toggle icon in the Developers Tools.

Lastly, here are the recommended web browsers for your computer and mobile phone that you should give a try.

WindowsMacOSiOSAndroidLinux
Chrome WindowsChrome MacChrome iOSChrome AndroidFirefox Linux
Firefox WindowsSafari MacSafari iOSEdge AndroidChrome Linux
Edge WindowsFirefox MacEdge iOSSamsung InternetEdge Linux

If you've any thoughts on How to Enable Mobile Site View in Chrome Computer?, then feel free to drop in below comment box. If you find this article helpful, please consider sharing it with your network.

Also, please subscribe to our BrowserHow YouTube channel for helpful videos tutorials.

Disclosure: This page may contain affiliate links, which means we may receive compensation for your purchases using our links; of course at no extra cost to you (indeed, you may get special discounts). This will support our effort to create more useful content, and keep it open and free forever.

4 thoughts on “How to Enable Mobile Site View in Chrome Computer?”

  1. rowshon

    I did exactly like this now want disable. Could you white about How to DISABLE Mobile Site View in Chrome Computer?

    1. Editor

      Click on the same device toggle button that enabled the mobile site view. Else, you can also close the developer tools window to turn off Mobile Site View in Chrome computer.

  2. So, there’s no way to stay on mobile mode without an extention app switcher? The code on the right gets in the way. But I see you can click the 3 dots in the DevTools area and click ‘undock into separate window’.

    1. Editor

      Yes – we can undock and continue mobile view in a separate window. However, the developer window will still be active. Maybe minimizing or hiding it should help from distraction.

Leave a Reply

Your email address will not be published.