1

I implemented concept of responsive design but now we face a issue. The content seems to be fit in nicely inside the frame. I've used max-device-width and so on. My font-sizes all use a fix sized pixels that is 12px and so on. Now when I gave it to my client he complains it looks super tiny on iPhone. I don't actually have an iPhone to test the designs.

Is there anyway to test it without using the actual device? a simulator or something? I tested it on Chrome by resizing the browser window but on actual device it looks super tiny and very difficult to read. Attached is one screenshot:

enter image description here

Jack
  • 7,433
  • 22
  • 63
  • 107
  • 1
    I'm not sure if this will solve your problem, but I use this: [http://www.responsinator.com](http://www.responsinator.com) – mfjones Feb 07 '13 at 06:01
  • http://stackoverflow.com/questions/3882233/iphone-browser-simulator-for-windows – Tim M. Feb 07 '13 at 06:02
  • If you have a Mac, you can test the site in the iOS Simulator that comes with Xcode. – Antony Feb 07 '13 at 06:13
  • @all: Well responsinator shows correct layout but the client complains he sees tiny. On responsinator I correcly see only 5 songs but on real iPhone I see 15 :( – Jack Feb 07 '13 at 06:46

4 Answers4

5

If you have Chrome browser than you should try to change the user agent.

Step 1: Open Chrome => go to the desired website => press F12 => the Elements Panel should appear.

Step 2: Click on the Settings icon. It should be in the lower right corner (if the design hasn't changed):

enter image description here

Step 3: Click on the Overrides tab:

enter image description here

Step 4: Check the User Agent and select a device from the drop-down list. Don't forget to check the Device metrics, where you can add custom values too:

enter image description here

More information at the Chrome Developer Tools.

UPDATE:

For Chrome version 32+ see this link for chrome Developer Tools.

Barnee
  • 3,212
  • 8
  • 41
  • 53
  • Correct. I now see 15 songs. ios 4 resolution is 960×640 and I see 15 songs in that. Now how do I solve that? If make bigger font size, the songs look super big while on desktop. Any ideas? – Jack Feb 07 '13 at 07:15
  • You should try [media queries](http://css-tricks.com/css-media-queries/). But I don't understand clearly your problem. – Barnee Feb 07 '13 at 07:29
  • If it's "Correct" than you could select it as accepted answer. Thnx! – Barnee Feb 25 '13 at 07:46
1

You could try : responsive.is The site has different orientations and devices on which you can see how the site may render.

user744113
  • 131
  • 1
  • 6
1

Screenfly by quirktools is what I use. Works like a charm for me!

http://quirktools.com/screenfly/

Charles Ingalls
  • 4,521
  • 5
  • 25
  • 33
0

You can try to use http://www.isresponsive.com enable you to test responsive design on different devises.

Yahya Younes
  • 670
  • 6
  • 14