12

I'm developing homepages to myself. The pages looks good on my laptop but I would like to see if it looks good also in my mobile. Can I test how the sites looks in mobile without publishing the site first in the Internet? My laptop has Ubuntu 20.04.

4
  • 7
    THis has nothing to do with Ubuntu (or unix, linux, whatever)
    – Hobbamok
    May 12 '20 at 2:51
  • 4
    @Hobbamok why do you think? I disagree. The Q is about how to achieve something in Ubuntu. OP did not know that one solution is cross-platform. It could have been placed somewhere else, but it's ok here.
    – pLumo
    May 12 '20 at 6:42
  • How would you test once the site has been published? Honest question.
    – Carsten S
    May 12 '20 at 14:43
  • Note that you can install a webserver (the software) on your own machine and access that using your mobile if they can see each other on your home network. That allows you to be certain. May 13 '20 at 7:07
31

Firefox and Chromium have Responsive Design Mode:

Press Ctrl+Shift+M

(For Chromium accessible only in Developer Tools, in Firefox globally)

enter image description here

8
  • 3
    Super+Alt+M in Firefox on macOS.
    – Kusalananda
    May 11 '20 at 8:18
  • 1
    An alternative, on Chrome, is to press F12 and then click the tiny symbol after the cursor symbol, on the top right corner. May 12 '20 at 12:53
  • 3
    One small note: This method only sets the window size the page is displayed in. Although this is a fairly good preliminary testing method, it does not emulate mobile browser bugs and shortcomings; also, you need to keep in mind that there still are differences between mouse and touch input. The last test before deployment should be on the real device (or in an emulator; Android Studio contains one and is available as a linux build).
    – orithena
    May 12 '20 at 13:29
  • 1
    @IsmaelMiguel "The last test before deployment should be on the real device" is what I was getting at (yes, I was glossing over details in the sentences before)... and judging by your words, I think we can agree on that.
    – orithena
    May 13 '20 at 9:12
  • 1
    @orithena I totally agree! If you have a real device, test on it before deployment. You never know which nasty bugs you will find. If you don't have a real device, try installing Android on a VM. Or use Mac's xtools to simulate an iPhone (I found it to be really close, but still not perfect). But the last step should always be to double-check on a real device. May 13 '20 at 9:16
1

IF YOU ARE WILLING TO USE WINE,

Try the chrome based Blisk (blisk.io). It's great for web design as you can preview for tons of common mobile platforms.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.