Please add this 1 line, make HN mobile friendly
<meta name="viewport" content="width=device-width, initial-scale=1"> I tried this for a few hours some time ago. It made the site less usable on most Android and iPhone devices with normal smartphone screen sizes. Text in a number of places ran together and comments shrunk to one character per line a few replies down. So it's not that simple. Real changes to make the site truly responsive are larger and I can't promise they'll come soon. It's already pretty bad, at least on Android - I have a hard time editing my text when there is a typo somewhere due to the bottom of the text field expanding and including the "reply" button, so I can't select the last line with my fingers. I saw a comment on HN sometime back and can't seem to find it now, but thought it had some merit. The gist of it was that enabling posts from mobile might lead to lower content quality as typing on phones is tougher and we tend to focus on a quick reply rather than a thought out discussion. I personally use http://hn.premii.com on mobile & it has a good reading experience. It's an orthogonal issue. I would like the official site to be vaguely readable on mobile. Whether they then choose to discourage posting from mobile is a different question. (My personal view is that 'mobile' is very difficult to define. If I connect a bluetooth keyboard to a Galaxy Note then why the hell should I be discouraged from posting on the grounds I might post lower quality comments?) Even on my 7-inch tablet, mobile sites are mostly just a pain in the neck. I'll almost always prefer to be served the desktop version served to me (exceptions for sites that expect me to hover my mouse over their content.) In my view mobile sites should mostly be "small display" sites, and they should be served to desktop people with small browser windows, too. Worst of all are sites that don't provide a "Full site" link, and don't cooperate with my browser's "View desktop site" option. And don't get me started on "Try our mobile app"... I used to use hn.premii.com since sharing articles from there shares the hn.premii.com link which seems to steal the page view from the authors post - I may be wrong though. I use the HN Enchancement Suite chrome extension[1] now instead on my desktop and cheeaun.github.io/hackerweb on my mobile. [1]: https://chrome.google.com/webstore/detail/bappiabcodbpphnojd... No, you cannot just add that to the top of a web page and have it magically transform into a mobile-friendly page. It may look fine on your particular device, but it will probably be completely hosed on everything else. The viewport meta tag is essentially a switch which tells mobile browsers to not provide a default page width of 980px, auto zoomed out, but to instead use the device's CSS pixel dimensions, with a zoom you define with initial-scale. Note that this is not physical pixel dimensions. A mobile device's CSS pixels are the physical resolution divided by the device's devicePixelRatio, which currently can range from 1 to 3. Examples: On an iPhone 5s, which has a physical resolution of 1136x640 and a devicePixelRatio of 2, a viewport with "width=device-width" will create a page that only has 320px in portrait and 553px in landscape in CSS pixels. On a HTC One, which has a physical resolution of 1920x1080 (1080p) and a devicePixelRatio of 3, the page will have only 360px in portrait and 640px in landscape. On tablets, CSS pixel portrait width can range from 600px on a Nexus 7 and Kindle Fire HDX, to 768px on an iPad mini non-retina, to 800px on a Nexus 10 or Kindle Fire HDX 8.9". Using a viewport meta tag needs to be done in combination with CSS media queries (or a very flexible design that doesn't use px for sizes) to ensure that your web page design responds to the various screen sizes without breaking. Hope that helps clarify things a bit - trust me, it's a common misunderstanding. I am not sure what this is meant to address. The worst thing for mobile users is the teeny tiny voting buttons. I believe that votes are important and are not used enough and part of the reason is fear of accidental downvote. The other thing that could be fixed is when someone puts a very long unbroken string in a comment without putting it in a code block. This makes the page very wide, and creates an unpleasant experience. I have 157 karma and I can't downvote anything. How exactly do you downvote on HN? I've never seen anyone explain that (and I can't really see it in the settings either). I believe you have to have about 500 karma to downvote comments. For me it was: Karma = 500, the number might change over time. HN needs more than that - enabling it: Throw the template and CSS, and some sample data on GitHub. HN'd have a working version in 24 hours. What's that emulation plugin you're using there? Chrome's stock developer tools. You're right, I never saw it's in there. Sometimes you use a piece of software a lot and yet it's still possible overlook obvious features, I guess :) Especially since said software auto-updates and adds these features. :) I think the emulation feature is very recent. Agreed. I just suggested a "What's New in DevTools" feature to Addy. I have no idea as to the status of userscripts on mobile devices but at least on the desktop they are my go-to for personalizing my internet: Agreed. Seems like a easy win for everyone. Are there any downsides? I use http://ihackernews.com/ all the time on mobile and it's working perfectly. Might want to give it a try! Oh, I may start using this on my desktop if only for the collapsing comments! I think we are all looking at the amount of work that would need to go into this, and not looking at the simple fact that maybe PG doesn't want to manage a mobile site. If you don't understand what I mean by "manage", then consider yourself lucky as you have not worked in the digital agency world. HN's relatively simple, eg it's already a single column layout. Relative widths would do 90% of the job. I would hazard a guess that it's not how simple the site is or the changes would be, it's a matter of managing it. On other note - Is there an extension/app for HN that categorizes the posts into topics (based on some text analysis) & enables the user to filter them out from the feed? Feature akin to what lobste.rs provides. This will basically enable me to filter out fluff stories that manage to rise up. I think I saw them experiment with something like this briefly. http://hckrnews.com is rather mobile-friendly (and looks georgeous as well). Gorgeous is a little bit of an exaggeration. It looks nice, but I think it fails to reach "gorgeous." Or you know, make the front-end layer open source s owe can send in PR There's no revision control so you can't send a PR, and news.css isn't included in the archive. why not just use an app? Why use an app (storage space, compatibility issues) when the website is better? One of those crammed to the brim with "in-app analytics" and other goodness? Certainly, I'll take two of those. Or use mine, zero analytics code at all, and stays out of your way when you're reading/contributing to HN: https://itunes.apple.com/us/app/news-yc/id592893508?mt=8 Oh yeah, and it's entirely open sourced, including my libHN library for interacting with HN in your own app you make: Thanks for sharing. Just downloaded and am using it right now. Just the fact that I can comment once again is a huge improvement over my last daily. I was really beginning to miss my Android and its version of HN. Is there any Android app that lets you post? The ones I've tried are either read-only or only let you vote. Thanks! Shame that unlike Hacker News Droid, it doesn't have offline support; I like saving the comments for reading on the bus. Maybe I'll submit a pull request as a way of learning Android development. If you visit a page, it saves the comments. I use this to bypass my anti-procrast settings. Acting against my own interest there. using this as my daily, great app! All apps are read only. No, at least for android there are r/w ones. None ive tried been perfect so far though I'm iOS so I can't say anything about Android. All decent apps for iOS are read only. Use mine - I think it's the best HN app out there: https://itunes.apple.com/us/app/news-yc/id592893508?mt=8 It lets you login, vote, post and comment. The only thing it doesn't do yet (but updates will be coming soon) is voting in polls. I use it when I'm at home and I can get on my computer because I honestly think it's a better experience than using the browser. No news:yc allows you to post comments. It's available for iOS. Not sure about Android. Using it right now; works really well. So far the only thing I've used that I like, even without commenting is Premii's Hacker News. What will it do? A pair of before-and-after screenshots would be helpful. or just use http://ihackernews.com or use RSS and format it however you like?
("news.ycombinator.com" === window.location.hostname) &&
(function () {
var meta = document.createElement("META");
meta.name = "viewport";
meta.content = "width=device-width, initial-scale=1";
if (document.readyState === "complete") {
document.head.appendChild(meta);
} else {
document.addEventListener("DOMContentLoaded", function () {
document.head.appendChild(meta);
});
}
})();