Calin Baenen
Posted on
As someone who can only primarily test (web)apps on PC, how can I make sure my site looks good or mobile?
For further actions, you may consider blocking this person and/or reporting abuse
Read next
A Powerful Password Generator NPM Package
abhilaksh-arora -
Creating a Pokémon guessing game using Supabase, Drizzle, and Next.js in just 2 hours!
ashish -
Embark on a UI Odyssey: 5 Spectacular Libraries to Explore
Bojan Jagetic -
Beyond Uptime: Essential Website Monitoring Checks
UpZilla.co -
Top comments (10)
Open Google Chrome, visit your site, press F12 key or mouse right click -> inspect.
At the top left of the developer tools you'll see an icon of a phone in front of a tablet, like that:
but without the desktop screen.
Hit it, and then at the top of Chrome, just below the address bar you'll see a drop down, where you can select multiple devices.
Hope it helps
search.google.com/test/mobile-frie...
But resizing the browser window isn't even close to the same as testing on a real device. You're going to end up in a situation where someone with a certain iPhone model exhibits a bug, which you cannot reproduce on a desktop browser.
Another option is to run android/iOS on a virtual machine, but especially the latter may be difficult, as iPhone emulator is only available for MacOS.
Third, obvious and expensive option is to buy a bunch of different mobile phones to test with, and periodically buy the new models.
printsbery.com/digital-planners/go...
So, are you saying that the test site checks only by resizing the browser, or are the URL and the sentences after separate?
I'm assuming the former but wanna be sure.
Huuuh.
So thaaaat's how it started!
    /j
On the devtools you have the option to test the your webapp on the mobile version, including the touch funcitonality.
I’d rather borrow my friend’s phone and then browse the web there.
What is "there"?
On his/her web browser. If you just want to check different screen width and don’t care about the actual user agent, then you can use native web developer feature on Chrome or Firefox.
Ctrl+Shift+M on Firefox.
I see.
Why do you prefer an actual phone over dev-tools?
Touch screens have different web API. You will know the difference, for example, when your draggable element suddenly not working on mobile because your draggable functions uses
mousedownevent instead oftouchstart.It is also not possible to simulate pinch/zoom event using mouse. Because unlike hand, mouse only have one cursor/pointer.