1

Ok, so I know how to write code for multiple screen sizes. But, I have no idea how to view my code on a mobile device before making my site go live. Please help!

intboolstring
  • 6,891
  • 5
  • 30
  • 44
  • Hey @KeeganBrown, if an answer helped solve your specific problem, I would mark it as accepted. Otherwise, if it was still helpful, I would give it an up vote. – intboolstring Dec 29 '15 at 22:43

4 Answers4

0

You can play around with emulators which can simulate a variety of cellular devices. These can be downloaded using a program called Bluestacks for example.

Untitled123
  • 1,317
  • 7
  • 20
0

If you have Google Chrome you can open a website and press F12 (on windows) to enter Developer Mode.

On the top left you can see a little smartphone icon. enter image description here

Click it and choose a device. Then refresh the page.

Chrome will emulate the experience of a smartphone user straight from your computer, sou you can test it from there.

This is a view of this question on the emulator: enter image description here

Phiter
  • 14,570
  • 14
  • 50
  • 84
0

Here is the solution if you are using safari.

  1. Enable the "develop" menu bar using Safari > Preferences > Advanced. Your menu bar should look like this:enter image description here
  2. Go to your website
  3. Go to Develop > User Agent and choose the device/browser you wish to emulate.enter image description here
intboolstring
  • 6,891
  • 5
  • 30
  • 44
0

You have two options.

  1. Use of Emulators.

What you need - is any modern browser. Nearly every modern browser will offer you roughly similar emulator capabilities where you can select a target device/resolution. @intboolstring & @Pither has already mentioned safari & chrome options for you. IE & Edge have similar features (which you can probably explore yourself or see this link IE Emulator feature).

  1. Using actual devices.

What you need - 1) wireless router 2) your dev machine/laptop which has a web server (like IIS on windows) & 3) some mobile devices (I would assume you would have atleast one smartphone which has a mobile browser on it).

You will need to connect your dev machine/laotop & your device(s) to the wireless and setup firewall on your dev machine to allow access to your website on your local wireless network. Check out this answer.

Once this is done, you should be able to load your site on any device connected on your wireless by tying http://your.dev.machine.ipv4:port-if-applicable/landingpage.html in the mobile browser.

(to find your machine's ipv4 address, goto command prompt and type ipconfig and press enter - I am assuming you are using windows)

You may be limiting your testing to a much smaller set of devices (ones you have access to). But this will give you a real-world idea (if not a much better one) of how you site renders & behaves on devices.

Community
  • 1
  • 1
Suri
  • 56
  • 1
  • 6