

Show HN: Test your website's responsiveness - jak1192
http://mobilewebsim.jonahkatz.me/

======
stack0v3erfl0w
There is a similar tool built into Firefox (Tools -> Web Developer ->
Responsive Design View)

~~~
jak1192
Didn't know that. That's pretty cool. However, its only for Firefox 15 which
isn't available for mac yet..

~~~
stack0v3erfl0w
It is available for Mac! The latest available version is Firefox 21.0 (stable
channel).

[http://www.mozilla.org/en-US/firefox/all/](http://www.mozilla.org/en-
US/firefox/all/)

~~~
jak1192
What do you know. I updated Firefox from Firefox itself and it only updated me
to 12.

------
amwelles
Neat tool, but... Should we be targeting specific devices? Shouldn't things
look awesome at _any_ screen size? Like somebody already mentioned [1], this
doesn't include Android options, Windows phone, or anything else.

[1]
[https://news.ycombinator.com/item?id=5928448](https://news.ycombinator.com/item?id=5928448)

~~~
jak1192
Good point. But if one wanted his site to look awesome on any screen size, he
could use this tool to confirm that it does.

------
wholalotta
it doesnt work. I checked my website from my iphone4s and from your tool. They
are not the same.

~~~
jak1192
Hmm. What's your website?

~~~
nopal
[http://www.louiewatch.com](http://www.louiewatch.com) looks different on my
iPhone 5 and your site (accessing site using Safari 6.0.5 on OS X 10.8.4).

------
marban
[http://screenqueri.es](http://screenqueri.es) is the much better choice (if
you really want to skip the test in an actual emulator)

~~~
jak1192
That's cool!

------
tehwebguy
Looks pretty cool! Side note, I just learned about X-Frame-Options as a result
of entering [http://google.com](http://google.com) in the form box using
Safari

[https://developer.mozilla.org/en-US/docs/HTTP/X-Frame-
Option...](https://developer.mozilla.org/en-US/docs/HTTP/X-Frame-Options)

~~~
jak1192
Interesting. It seems Chrome doesn't support X-Frame-Options

~~~
anondesign
Not true. Chrome definitely supports x-frame-options (I believe the code for
that is part of webkit and is shared with safari).

~~~
jak1192
Well i based my hypothesis on the fact that sites such as google.com and
yahoo.com which dont get rendered in Safari as a result of X-Frame-Options do
get rendered in Chrome.

~~~
anondesign
You either have an ancient version of chrome, or have disabled some pref in
chrome to allow these sites to get rendered.

------
mmahemoff
You can also go into Chrome devtools, Settings, Overrides. Then you can set
the User Agent, which will also update the screen resolution. You can emulate
touch events there as well.

------
websitescenes
I skim hacker news on my iPhone and I couldn't see anything in the emulation.
I'll have try later on my desktop. Thanks for sharing.

~~~
jak1192
The point of the site is to simulate how websites would look on an iPhone. So
being you're on an iPhone, use of the site would be counterintuitive :)

~~~
websitescenes
A browser is a browser.

~~~
jak1192
so i guess that would make my responsiveness checker unresponsive

~~~
websitescenes
Guess so

------
paul9290
Is there a difference in using this tool vs. seeing how it looks as I scale my
browser down to iPad, Android and iPhone size?

~~~
jak1192
Its easier to match the aspect ratio using this tool vs scaling down a browser
(how do you know the dimensions of your browser?)

------
jusob
You can also check [http://mobilito.net/](http://mobilito.net/)

------
apolymath
i have to say that this preview thing is bullshit. For example, your web-based
iPad viewing size is only 582px wide, when in all reality, the iPad is 1536px
wide. Sorry, but this little test is an epic fail.

~~~
jak1192
The aspect ratio is consistent - which, in my opinion, is what's important.

~~~
sahaskatta
The aspect ratio of the browser's viewport and of the device's display IS NOT
the same. (That applies to portrait and landscape too.) The interface elements
at the top and bottom skew that quite a bit.

------
fady
do you know why a html file in my dropbox public folder would not display on
your site? dropbox public links work well in browsers. i use it a lot for dev
stuff

------
denzil_correa
This a very good hack. Kudos for it!

------
nudetayne
Unfortunately, this doesn't appear to render pages the same as Apple devices.

~~~
ancarda
If you use Safari (on OS X), you'll get a much closer rendering to the actual
device.

------
MostAwesomeDude
Looks like there aren't any Android options. That's a shame.

~~~
jak1192
Maybe I should put a chart of common device aspect ratios..

~~~
marban
no need — there's an option for ARs at
[http://screensiz.es](http://screensiz.es)

~~~
jak1192
That's a terrific reference. I wish I knew about it when I started developing

