You can see the mobile version of a website on a desktop computer in four ways: shrink the browser window, use Chrome DevTools device mode, install a mobile view extension, or open the page on a phone emulator. The first is quick but often wrong. The other three ask the site for its real mobile layout, which is what you usually want.
Which one fits depends on why you are looking. A designer checking spacing needs something different from a marketer who wants to see what customers see on an iPhone, or a developer chasing a bug that only happens on Android.
Why a narrow browser window is not the mobile version
Dragging the edge of your window makes the viewport narrower, so CSS media queries fire and a responsive layout reflows. That part works. What does not change is everything else the site knows about your device.
A phone sends a mobile user agent string and client hints such as Sec-CH-UA-Mobile: ?1. It reports a small screen size to JavaScript, a high device pixel ratio and touch support. Some sites use those signals to serve a different page, a separate m. subdomain, a lighter image set or a different menu. A narrow desktop window sends none of them, so you can end up looking at a squeezed desktop page.
There is also a practical limit: desktop Chrome usually will not let you shrink a window much below 500 pixels, while many phones have a viewport of 360 to 440 CSS pixels.
Method 1: Chrome DevTools device mode
Chrome has a built-in phone emulator. Open DevTools with F12 (or Cmd + Option + I on a Mac), then press Cmd + Shift + M on a Mac or Ctrl + Shift + M on Windows to toggle the device toolbar. Pick a device from the Dimensions list and reload the page.
Device mode changes the viewport, the device pixel ratio and the user agent, and it can switch to touch events. It also throttles network and CPU, which helps when you test speed. Google describes it as a “first-order approximation” of a phone, because your computer’s CPU and browser are still desktop ones.
The downside is overhead. DevTools takes up a third of the screen, the presets are generic, and you have to set things up again for every tab. We cover the whole process in the Chrome mobile emulator guide.
Method 2: a mobile view extension
A mobile view extension does the same core job from a toolbar button, without opening DevTools. Mobile View Extension for Chrome, for example, reloads the current tab inside a phone or tablet frame with a device-specific user agent, screen dimensions and device pixel ratio. You choose a named Apple or Android preset, switch between portrait and landscape, and capture a PNG screenshot of the framed view.
This is the fastest option when you check pages often, review a client site, or want to see a page “as a phone” while you keep browsing. It keeps the preview active as you navigate, and it works on localhost.
It has limits worth knowing. The preview runs in a frame inside desktop Chrome, so touch events are not generated and you still interact with a mouse. Hover and pointer media queries are not fully emulated. For touch gestures or performance on real hardware, use a real phone. The pros and cons of both approaches are compared in mobile simulator extensions vs DevTools.
Method 3: a phone emulator or simulator
When you need the actual mobile browser rather than desktop Chrome pretending to be one, use an emulator:
- Xcode Simulator (macOS only) runs real iOS Safari. It is the closest thing to an iPhone without owning one. See how to test a website on iPhone.
- Android Studio Emulator runs Android with Chrome on Windows, macOS or Linux. See how to test a website on Android.
Both are free, both are heavy downloads, and both take minutes to start. They are the right tool for engine-specific bugs, such as a layout that only breaks in Safari.
Method 4: request the mobile site directly
Some older sites still run a separate mobile site at an address like m.example.com. Typing that address into a desktop browser often shows the mobile pages directly. Modern sites rarely work this way, and many redirect desktop visitors back to the main domain, so treat this as a shortcut for specific sites rather than a method.
Which method to use
| Goal | Best method | Why |
|---|---|---|
| Quick look at how a page appears on a phone | Mobile view extension | One click, real mobile user agent, stays on while you browse |
| Debug CSS or JavaScript on a mobile layout | DevTools device mode | Elements, Console and Network panels sit next to the preview |
| Check a Safari-only bug | Xcode Simulator or a real iPhone | Only WebKit shows WebKit bugs |
| Measure mobile speed | DevTools throttling or a mobile page speed test | Desktop hardware hides slow scripts |
| Check tap targets and gestures | A real phone | Mouse clicks do not reproduce thumbs |
What to look for once you see the mobile version
Opening the mobile view is the easy part. The useful part is a short checklist:
- Text is readable without zooming, and body copy is at least 16 px.
- Nothing scrolls sideways. A horizontal scrollbar usually means a fixed-width element or a wide table.
- The menu opens, closes and can be used with a thumb.
- Buttons and links are far enough apart to tap.
- Forms show the right keyboard and are not covered by sticky bars.
- Images are sharp on high-density screens but not huge downloads.
For a fuller pre-launch list, use the mobile website testing checklist.
Frequently asked questions
Can I view the mobile version of a website in Chrome without an extension?
Yes. Open DevTools and toggle the device toolbar with Ctrl + Shift + M (Cmd + Shift + M on a Mac). An extension saves those steps and keeps the setting per tab.
Does zooming out or resizing the window show the mobile site?
Resizing shows how a responsive layout reflows at that width. It does not send a mobile user agent, so sites that detect the device will still serve their desktop version.
Is the mobile view on desktop exactly what a phone shows?
Close, but not identical. Desktop tools change the viewport and the signals a site reads. They do not change the rendering engine, the CPU or touch input. For a final check, open the page on a real phone.