5 ms·
Show HN: Test your website's responsiveness
- websitescenes 13y agoI 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 13y agoThe 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 13y agoA browser is a browser.
- jak1192 13y agoso i guess that would make my responsiveness checker unresponsive
- websitescenes 13y agoGuess so
- deleted 13y ago[deleted]
- tehwebguy 13y agoLooks 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-Options https://developer.mozilla.org/en-US/docs/HTTP/X-Frame-Option...
- jak1192 13y agoInteresting. It seems Chrome doesn't support X-Frame-Options
- anondesign 13y agoNot true. Chrome definitely supports x-frame-options (I believe the code for that is part of webkit and is shared with safari).
- jak1192 13y agoWell 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 13y agoYou either have an ancient version of chrome, or have disabled some pref in chrome to allow these sites to get rendered.
- marban 13y agohttp://screenqueri.es http://screenqueri.es is the much better choice (if you really want to skip the test in an actual emulator)
- MostAwesomeDude 13y agoLooks like there aren't any Android options. That's a shame.
- jak1192 13y agoMost Android aspect ratios are covered by the Apple devices I implemented. The Galaxy s4 for instance has a 16:9 aspect ratio, the same as the iPhone-5. However, more devices are to come! Feel free to contribute on Github (https://github.com/jak1192/MobileWebSimulator https://github.com/jak1192/MobileWebSimulator) :)
- marban 13y agoagain: http://screenqueri.es http://screenqueri.es
- jak1192 13y agoMaybe I should put a chart of common device aspect ratios..
- aw3c2 13y agoMost Android browsers actually reflow text to fit the screen, just like mobile browsers should. I don't think this website could simulate that.
- wholalotta 13y agoit doesnt work. I checked my website from my iphone4s and from your tool. They are not the same.
- jak1192 13y agoHmm. What's your website?
- nopal 13y agohttp://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).
- scrrr 13y agoSame here. CSS Media Queries are not respected. Looks alright on phone, but this test-website is showing the default desktop-version.
- stack0v3erfl0w 13y agoThere is a similar tool built into Firefox (Tools -> Web Developer -> Responsive Design View)
- jak1192 13y agoDidn't know that. That's pretty cool. However, its only for Firefox 15 which isn't available for mac yet..
- stack0v3erfl0w 13y agoIt 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 13y agoWhat do you know. I updated Firefox from Firefox itself and it only updated me to 12.
- sahaskatta 13y agoGoogle Chrome has it built into the inspector as well, however it is not nearly as fancy as the one found in Firefox.
- denzil_correa 13y agoThis a very good hack. Kudos for it!
- amwelles 13y agoNeat 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 13y agoGood point. But if one wanted his site to look awesome on any screen size, he could use this tool to confirm that it does.
- nudetayne 13y agoUnfortunately, this doesn't appear to render pages the same as Apple devices.
- ancarda 13y agoIf you use Safari (on OS X), you'll get a much closer rendering to the actual device.
- apolymath 13y agoi 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 13y agoThe aspect ratio is consistent - which, in my opinion, is what's important.
- sahaskatta 13y agoThe 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.
- paul9290 13y agoIs 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 13y agoIts easier to match the aspect ratio using this tool vs scaling down a browser (how do you know the dimensions of your browser?)
- fady 13y agodo 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
- mmahemoff 13y agoYou 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.
- jusob 13y agoYou can also check http://mobilito.net/ http://mobilito.net/