How to test a website on mobile without a phone
Six free ways to see how your website looks and works on iPhone and Android from a desktop — online checkers, browser device modes, simulators and emulators — and what each one can't show you.
You don't need a drawer full of phones to build a mobile-friendly website. Here are six ways to test from your desktop, from the quickest to the most accurate, and when to use each.
1. An online responsive checker (fastest)
Paste a URL into AKCLNT Responsive Checker and see it on several real phone, tablet and desktop viewports side by side — no install, nothing to configure. It's the quickest way to spot layout problems across many sizes, compare against a competitor, and send a share link to a client.
Limits: it uses your desktop browser's engine, and sites that block embedding can't be shown (see why).
2. Chrome / Edge device mode
- Open your site and press
F12. - Press
Ctrl+Shift+M(Cmd+Shift+Mon Mac). - Pick a device from the toolbar or drag to any width.
Device mode emulates the viewport, pixel ratio, user agent and touch events, and lets you throttle the network to "Slow 4G" — great for debugging one device with full DevTools.
3. Firefox and Safari responsive modes
- Firefox:
Ctrl+Shift+Mopens Responsive Design Mode. - Safari (Mac): enable Settings → Advanced → Show features for web developers, then Develop → Enter Responsive Design Mode. Because it's WebKit, it's closer to how iPhones render.
4. iOS Simulator (Mac)
Install Xcode from the Mac App Store, then open Xcode → Open Developer Tool → Simulator. You get real Mobile Safari on any iPhone or iPad model, including the Dynamic Island and the bottom address bar. Use Safari's Develop menu on your Mac to inspect pages running in the simulator.
5. Android Emulator
Install Android Studio, open Device Manager, create a virtual device (e.g. Pixel 8) and open Chrome inside it. To reach a dev server on your computer from the emulator, use http://10.0.2.2:PORT.
6. Your own phone, the easy way
When you do have a phone, skip typing URLs:
- Press ▣ QR in AKCLNT Responsive Checker and scan it.
- For a local dev server, expose it with a tunnel and scan the HTTPS link:
npx cloudflared tunnel --url http://localhost:3000- Debug the real phone from your desktop: on Android, enable USB debugging and open
chrome://inspect; on iPhone, enable Web Inspector in Safari settings and use Safari's Develop menu on a Mac.
What desktop testing can't show you
| Issue | Why emulation misses it |
|---|---|
| iPhone-only rendering bugs | All iOS browsers use WebKit; Chrome device mode uses Blink. |
| Real performance | Your desktop CPU is far faster than a mid-range phone. |
Browser UI and 100vh | Mobile address bars appear and disappear and change the visible height. |
| Keyboard behaviour | The on-screen keyboard can cover fixed inputs. |
| Fonts and touch feel | System fonts and finger-sized targets feel different in the hand. |
A simple workflow
- Build with AKCLNT Responsive Checker open in another tab — check the Big 3 after every major change.
- Debug specific problems in DevTools device mode.
- Before launch, do a pass on one real iPhone (or the iOS Simulator) and one real Android phone.
FAQ
How can I see the mobile version of a website on my PC?
Paste the URL into an online responsive checker like AKCLNT Responsive Checker to see it on many phones at once, or open the site in Chrome, Edge or Firefox and press Ctrl+Shift+M to turn on device mode.
Is Chrome device mode the same as a real iPhone?
No. It sets the screen size, pixel ratio and user agent, but still uses Chrome's rendering engine. iPhone browsers all use WebKit, so test on Safari's simulator or a real iPhone before launch.
How do I test my localhost site on my phone?
Connect both to the same Wi-Fi and open your computer's local IP and port on the phone, or create a public HTTPS tunnel with cloudflared or localtunnel and scan its QR code.
Free, no signup — preview any URL on phones, tablets and desktops side by side.