Looking for a mobile webpage emulator.

Discussion in 'Web Design and Development' started by PinkyMacGodess, Mar 2, 2016.

  1. PinkyMacGodess macrumors 68040

    PinkyMacGodess

    Joined:
    Mar 7, 2007
    Location:
    Midwest America.
    #1
    I am looking for a way to test mobile websites on Firefox on my Mac Pro. I haven't looked that far yet, but am finding some sites that offer that, for a cost. I can't afford to pay for that functionality on a progect I get no money out of.

    Thanks for any ideas...

    So far, my experience has been that when I try to go to a mobile site on the iMac version, it automagically flips to the standard, non-mobile, website...
     
  2. olup macrumors 6502

    Joined:
    Oct 11, 2011
    #2
    Not sure, if it's exactly what you're looking for, but Firefox comes with responsive design mode that allows you to test the reponsiveness of websites. https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_Mode
     
  3. PinkyMacGodess thread starter macrumors 68040

    PinkyMacGodess

    Joined:
    Mar 7, 2007
    Location:
    Midwest America.
    #3
    Apparently there is some web testing site with a .me domain that charges for the privilege...
     
  4. BillyBobBongo macrumors 68020

    BillyBobBongo

    Joined:
    Jun 21, 2007
    Location:
    On The Interweb Thingy!
    #4
  5. Rab Simpson macrumors regular

    Rab Simpson

    Joined:
    Feb 10, 2006
    Location:
    Glasgow, Scotland
    #5
    Make the window smaller.

    If the page retains the desktop styling the developer has used the outdated user agent/browser sniffer method of determining which stylesheet to load as opposed to using a layout which is actually responsive, in which case you can use a user agent switcher and refresh the page to see the different layouts.
     
  6. PinkyMacGodess thread starter macrumors 68040

    PinkyMacGodess

    Joined:
    Mar 7, 2007
    Location:
    Midwest America.
    #6
    The main site is hosted through a company called 'club express'. I have *some* control over things, but a lot of the basics are out of my control. I found out that they use a menu on the bottom of the mobile screen, which makes things easier to use. I checked, and there are very limited things that I can do. I will probably have to keep my iPad next to the monitor to keep referencing the changes. They also make it hard to 'revert'. The changes are 'permanent'. It makes development rather an example of, perhaps, driving the rovers on Mars. Frustrating, but it's what I have to live within.
     
  7. Rab Simpson macrumors regular

    Rab Simpson

    Joined:
    Feb 10, 2006
    Location:
    Glasgow, Scotland
    #7
    It sounds like a SAAS site as opposed to a site which has been developed bespoke.
     
  8. kiwipeso1 Suspended

    kiwipeso1

    Joined:
    Sep 17, 2001
    Location:
    Wellington, New Zealand
    #8
    You can request the mobile versions in most browsers by changing the reported user agent.
     
  9. grizfan macrumors member

    grizfan

    Joined:
    Feb 10, 2012
    Location:
    Boise, ID
    #9
    you have a variety of options. To start with, in Firefox, get the http://getfirebug.com/ extension. This is probably one of the best tools around, and it does offer the ability to preview a site simulating various browsers, operating systems and platforms.
    Also, enable the developer tools in Safari, which as a very nice 'responsive design mode' that will let you preview a site simulating various phones, tablets, etc...

    Now, if you're technically inclined, https://www.browsersync.io/ is a great option, especially if you use Grunt or Gulp as a web designer.
     
  10. dan1eln1el5en macrumors 6502

    dan1eln1el5en

    Joined:
    Jan 3, 2012
    Location:
    Copenhagen, Denmark
    #10
    Safari can (enable the developer menu) and it's pretty nifty.
    Chrome (again enable developer)

    But why you want to pay to those online services, would be to test on different web-engines (i.e. IE, Firefox etc.) there are some sites that do it for free, but yeah, it's impossible to think of "all" the use-cases and you can't be 100% sure it all works as intended all around.
     
  11. grizfan macrumors member

    grizfan

    Joined:
    Feb 10, 2012
    Location:
    Boise, ID
    #11
    Virtual Machine Software can be a great option, too. VirtualBox is free and open-source. With that, you can spin up any Linux variant in OS X, and even Microsoft is getting into the act. https://dev.windows.com/en-us/microsoft-edge/tools/vms/mac/ allows you to run any combo of IE, from IE6 on XP to Edge on Windows 10. Each VM expires after 90 days and needs to be re-created, but it is an excellent test resource, and Microsoft deserves some credit for providing this (and making their browsers better)
     
  12. breadadams macrumors newbie

    breadadams

    Joined:
    Mar 16, 2016
    #12
  13. thisismyusername macrumors member

    Joined:
    Nov 1, 2015
    #13
    There are 2 general ways to run a mobile version of a website on a desktop browser and you should never pay for software to do this. Which one you need to use depends on how the site was designed.

    1) Setup your browser to send a different User Agent. This is the way to go if the website was designed in such a way to render differently depending on the user agent. On Safari, enable the developer menu, Develop->User Agent, select the one you want, refresh the page. This is common for websites that only have 2 versions: a desktop version and a mobile version.

    2) Simply shrink the size of your browser window. Some websites render their layouts differently depending on the window size, instead of relying on the User Agent to determine how to render it, in order to accommodate lots of different screen sizes/resolutions. Websites that follow the responsive web design approach use this method.

    Try both to determine which one is appropriate.
     
  14. Flood123 macrumors 6502a

    Flood123

    Joined:
    Mar 28, 2009
    Location:
    Living Stateside
    #14
    I use chrome dev tools.
    Also,
    xcode has iPhone and iPad emulation.
    right click on Xcode app> show package contents > contents >developer > applications > simulator
     

Share This Page