Ask HN: Mobile site

97 points by rangibaby 11 years ago

HN looks a bit fuarked on my iPhone now. Could you please change it back to serving the desktop version?

dang 11 years ago

I posted about this three times last night before going to sleep, feeling sure that the info would get into circulation. Apparently not! Will explain shortly.

Edit: Here's the story. We occasionally hear from users who say that all of HN's problems on mobile could be fixed by adding one line of markup:

  <meta name="viewport" content="width=device-width, target-densitydpi=medium-dpi">

We tried it several times and found it didn't work [1]. Last night, we tried again. It looked better than before, so we decided to leave it on for a while and wait to hear from you all [2].

Unfortunately, what happened is what I feared most: total disagreement. Since it was far from a clear win, we've rolled back to the status quo ante. I'm sorry to disappoint those of you who felt it to be an improvement, but you shouldn't have to wait too much longer.

Why not keep it and improve on its problems, or at least do a poll about it? Because it was at best a stopgap until we can release the real solution we're working on, which involves totally different markup. If the stopgap worked well for most people, it would be worth keeping in the interim. But a stopgap that doesn't actually stop the gap will create confusion. I feel like it's our duty to be conservative here until we have something that actually works. It's a high priority, and it's coming.

1 https://news.ycombinator.com/item?id=7985687, https://news.ycombinator.com/item?id=7330107, https://news.ycombinator.com/item?id=6253835, https://news.ycombinator.com/item?id=6253403, and probably others.

2. https://news.ycombinator.com/item?id=9205798, https://news.ycombinator.com/item?id=9205893, and https://news.ycombinator.com/item?id=9205858.

  • IgorPartola 11 years ago

    Honest question: don't you have the ability to see what it looks like for yourself or is the only way to test a change like this is to release it to production and measure the numbers of angry comments? Whether a small vocal minority that loves tiny text on small screens agrees or disagrees, the change was a strict improvement over the desktop on mobile version. Is this what YC advises its companies to do? Change nothing as to not piss anyone off, no matter how much damage that causes to the majority of the users? I find that software people are terrified of any change. Move a button and they scream. That does not mean that once something is developed it must stay that way. dang, do you really believe there won't be a public outcry when the new markup is released? Will you roll it back then because someone complained?

  • JDiculous 11 years ago

    Why did you revert the change? Now I can't comfortably browse HN on mobile anymore. It was fine on my Samsung Galaxy S4.

    Do you guys need a web developer or something? It's really not that difficult to make a basic site like HN responsive, and test it out on mobile devices (hint: Chrome dev tools let you simulate most mobile devices).

dpcan 11 years ago

No! Don't, please! It's sooooo much better on my phone now. I used to have to zoom in and put and scroll all over. Text is wrapping now, so maybe some aesthetics are lost, but usability is 100% better.

Also, this thread is going to get voted way up because the title just says HN: Mobile Site. But not necessarily because the op doesn't like it.

flibble 11 years ago

The new version looks much better to me on iPhone 6. No longer do I have to zoom in or use landscape mode to read the titles.

  • carbocation 11 years ago

    I agree. I do wish that comment voting arrows were as large as homepage voting arrows.

  • acqq 11 years ago

    Up and down arrows should be more separated. Ideally up-down should be undoable, I know it's harder to do.

    • DanBC 11 years ago

      The upvote / downvote buttons have been "wontfix" for years now. :-(

ctrlrsf 11 years ago

I've been using http://hn.premii.com with great success. Super slick UI and runs great as a full screen Chrome app. Missing features are adding comments and upvotes, but it provides direct link to real HN comments page where you can do that instead. Their Android app is good too, but web client feels faster on my phone.

  • anonbanker 11 years ago

    Feels very heavy on Firefox in Android.

    • thekingshorses 11 years ago

      Yes. Main problem is scrolling is not smooth. I told Mozilla mobile folks, but they think its smooth.

  • thekingshorses 11 years ago
    • qubitcoder 11 years ago

      I just wanted to extend my appreciation for your work. It's by far the most used app on my iPhone; even occupying a spot on the main navbar.

      Occasionally, I've noticed scrolling performance degrades when viewing comments (only for articles with many comments (>100). But force closing seems to resolve the issue. Otherwise, it's rock solid and beautifully functional.

      • thekingshorses 11 years ago

        iPhone 4s/5? I have 5s, and didn't notice that, but I also mostly use my Android device.

        It actually gets ycombinator page, parses DOM and generates JSON that I can use in my app. I think that might be the reason.

        • qubitcoder 11 years ago

          It's an iPhone 5s. It only occurs after I've used the app for a while, then switching to an article with a large number of comments; scrolling can become laggy enough to render the app unusable (i.e. scrolling even a small amount takes over a second; lag seems to scale based on the comment count).

          I'm guessing that if the DOM is parsed completely prior to rendering the comments, that shouldn't be a bottleneck--unless the parsing step is re-run as scrolling occurs to render comments dynamically.

          Or given that a forced restart resolves the issue, perhaps it's a memory issue; i.e. if the JSON data is held in memory for each article viewed, and it continues to grow. This is certainly not a showstopper, and it's a fantastic app! But figured you'd appreciate the info.

iphone_user 11 years ago

I second the request. Some things that makes it specially hard to read on iPhone:

1) It wastes a lot of horizontal space with white paddings on both sides. It may be a stylistic decision but takes valuable space that could be used to show more words in a line, leading to less lines 2) There is no right padding in the text lines, the text touches the right side of the inner container.

All in all it would be better to simply serve the Desktop version, maybe with an slightly increased font size so it is more readable.

And please don't make the same mistake many sites (Slashdot among them) make: trying to ram an ill thought bad designed new version on their faithful userbase just for the sake of change and novelty.

There are things to improve but the best way to determine it is to actually test it beforehand in the same environment it will be used in production. These changes were definitively not tested on iPhone's Safari and it shows.

  • amirmc 11 years ago

    > "... just for the sake of change and novelty."

    I agree with the earlier comments you make (re spacing) but this change isn't happening purely for the sake of it. Folks have been asking for a mobile-friendly HN for a long time. Even though I'm not overjoyed with the version I saw today, I'm glad it's progressing.

  • zodvik 11 years ago

    >> All in all it would be better to simply serve the Desktop version, maybe with an slightly increased font size so it is more readable.

    It is the desktop version with width adjusted.

    >> ... new version on their faithful userbase just for the sake of change and novelty. A mobile version of the site has been requested over and over again. So, it is definitely not for the sake of change and novelty.

    While it may not be perfect, it is still a better read on my OPO than the earlier desktop version.

addedlovely 11 years ago

Could still be much better, but looking forward to not accidentally fat fingering the comments link all the time.

I'd be happy to help improve, even working within the constraints of not changing any of the underlying markup. Feel free to message me.

Also what's with the '.rotate180' CSS class in the stylesheet, as much as I love reading upside down, I can't see why thats needed?

  • hoppi 11 years ago

    Perhaps when the orientation of the phone is upside down it can automatically rotate it for you.

tambourine_man 11 years ago

Yes, it's terrible on the 4s.

The menu doesn't fit the viewport and gets jammed if your username is more than a few characters long (or you have many karma points)

You still need to zoom to hit the up/down arrows, so not much is gained.

  • smackfu 11 years ago

    Same exact thing on an iPhone 6.

  • jackgavigan 11 years ago

    Looks ++ungood on the 5s too: https://twitter.com/jackgavigan/status/577121192664006657

    The menu even wraps on the iPad in landscape orientation: http://i.imgur.com/4ghJIufh.jpg

    • IgorPartola 11 years ago

      Are you here to read the menu? I spent a huge amount of hours reading comments on HN on mobile. In fact it is the only site that does not work on mobile that I don't refuse to visit. So while I don't understand why it took HN nearly 7 years to become slightly more mobile friendly, I will take any improvement to its readability.

nether 11 years ago

No, I vastly prefer the mobile site on my phone.

  • Synergyse 11 years ago

    +1, zooming all the time was getting tiresome. It could use a few small tweaks in font sizing and margins, but its vastly improved.

    • ctrlrsf 11 years ago

      I agree it's moving in the right direction. Zooming out and using landscape gets annoying.

  • nailer 11 years ago

    Please, on #hnmain:

      width: 100%; // Fixes white borders (browser default table width is normally something like 85%) 
      max-width: 750px; // Keeps columns from getting overly wide on desktop
    • kaoD 11 years ago

      I usually specify my max-widths in em (empirically found the sweet spot at about 40-60em).

      I do it because I think it maps better to text widths, which is what you ultimately want to prevent getting overly wide. It also handles different font sizes fine, making the site still accessible for people with big system-wide fonts.

      I'd like to know, is there a downside to em or a reason to use px instead?

      • nailer 11 years ago

        Hrm, that's an interesting concept I hadn't heard of before. I use px because that's what Chrome's responsive view uses, and because that's what viewport uses. I think 'big text' is generally going out of fashion in favour of proper zoom (though we should really get some numbers on that).

cauterized 11 years ago

IMO the idea of a mobile site is a good one but right now the font sizes are definitely too large for comfortable reading (esp in landscape orientation) where before they were way too small.

  • autoreverse 11 years ago

    FWIW font size is ideal for me.

    • zodvik 11 years ago

      Font size seem ideal on homepage. But, font-size for comments is smaller.

      • cauterized 11 years ago

        It seems to differ per page. Font size on the homepage and threads page are ridiculously large for me in landscape and ok in portrait. Font size on article comments is ok now - think they may have just tweaked it.

        Edit: I take that back. Still unreadably large in portrait.

hobarrera 11 years ago

Where is this mobile site? I'm seeing the same old desktop version on my mobile and no new "Mobile version" link.

I don't see any changes to this one to make it responsive either.

  • nailer 11 years ago

    OP means responsive design, not 2010-era separate mobile site. Front page is responsive (but still needs some fixes), comments pages are still super wide and need scrolling on each line.

lvillani 11 years ago

I use HackerWeb (http://hackerwebapp.com) on both my iPhone, iPad and Fire Phone (Firefox OS). It is a superbly executed HTML5 application.

  • realusername 11 years ago

    I also use this one, it's really well done and works very well.

  • jschulenklopper 11 years ago

    +1 for a great app! It's a pity that it's a read-only view on Hacker News; you can't upvote stories, comment or submit anything. It puts you in lurking mode, alas.

    And for the people thinking "How does that HackerWeb compare to the web app of Lim Chee Aun?": it's the same as http://cheeaun.github.io/hackerweb/.

Houshalter 11 years ago

http://i.imgur.com/qr6MAwK.jpg

This is absolutely awful, how do I fix this?

Edit: I guess that isn't so awful, but before you could see maybe 20% of the links and zoom in as needed. Now it's forcibly zoomed in so much you can only see one link and everything is squashed together.

bennesvig 11 years ago

The menu looks a little goofy, but overall the experience of reading the links is now far better on my iPhone 6.

raldi 11 years ago

The new frontpage disables Android's double-tap-and-drag-down zoom function, which is a gigantic regression for a site with tiny arrows and tiny links.

cddotdotslash 11 years ago

It's like they added a percentage width to some tables and now it's "mobile." (Edit: spelling)

  • falcolas 11 years ago

    Amazing the (IMO) improvements a few percentages adds to the readability on mobile.

mostafah 11 years ago

It’s not a separate mobile site. It appears they’re adding a little responsiveness to the current design. And that’s a great idea for this kind of content.

charlieegan3 11 years ago

I made this site for myself: http://www.serializer.io it's linear and takes content from r/programming and product hunt too but it's what I use for reading HN on my phone.

logotype 11 years ago

Better! Just less left/right margins.

DanBC 11 years ago

Perhaps HN mods could have a poll on the different changes? I like big fonts; I like the bigger buttons; I'm less keen on the big margins but I don't particularly care about them.

bhauer 11 years ago

Lumia 930 here and I'd vote for reverting to the desktop site.

The new front-page zoom is so pronounced that only seven items are displayed simultaneously (previously around 20 to 25). It is obviously easier to click on article links, but not notably easier to click on comment links or the voting arrows.

The comments page is the real problem. Where I used to see the whole width of the comments page and was able to read without adjustment, the page shows the left half of comments initially and I must zoom out every time.

anonbanker 11 years ago

Screw all the iphone users. HN is now usable on firefox/Android. Don't change it back because Safari has rendering bugs.

pmontra 11 years ago

Yesterday version was better on my Galaxy S2 with Opera (blink engine). The new one has left and right margins that reduce the area available for text. That's much visible on the home page. The comments pages are maybe the same but I've got the feeling that text is smaller because I don't remember having to tap so often to read.

stesch 11 years ago

Were there any recent changes? Site looks a bit big on the iPad now. :-(

I don't really want to see any mobile version on my iPad.

  • nlh 11 years ago

    Agreed - was just about to post this. The whole point of the iPad, IMHO, is to give a "portable desktop" browser experience. I can't stand when sites do the awkward in-between tablet version. Looks worse and less usable. I'm ok with the idea of responsive design, but let's stick with desktop and phone as the two versions.

colinprince 11 years ago

cautiously optimistic. keep iterating..

chimeracoder 11 years ago

Are the comments rendered differently on the mobile site, or simply the homepage? For what it's worth, I'm still getting the desktop version of the comments on Firefox for Android[0].

[0] User-Agent: Mozilla/5.0 (Android; Mobile; rv36.0) Gecko/36.0 Firefox/36.0)

cturhan 11 years ago

Home page is ok but comments page is wide and I can't read them

izolate 11 years ago

The padding around the content on the page is a bit excessive.

geuis 11 years ago

Please get rid of the white padding on the sides. Takes up valuable area and squeezes the center content too much. Particularly bad in landscape.

p4bl0 11 years ago

Mh, on my phone it is as it has always been (which is not good on small screen operated with fingers). How do I see the mobile version?

evo_9 11 years ago

The header bar is pretty bad on iPhone5; needs to be totally reworked if you are going to roll your own mobile like this.

Why not just use Bootstrap?

JDiculous 11 years ago

Looks like only the home page is responsive now. Viewing this thread right now on a Samsung Galaxy S4 and the font is too small.

Mahn 11 years ago

The header looks a bit odd to me, but otherwise I find it a massive improvement; no need to zoom any longer.

magoon 11 years ago

At least we can still zoom. +1

lettergram 11 years ago

I kinda like the mobile version, it seems to have a bit to go, but not bad.

rainhacker 11 years ago

I read it using flipboard on my iphone. Works like a charm.

xasos 11 years ago

On Chrome, you can do Menu -> Request Desktop Version

stangeek 11 years ago

Use the HN Cards app on iPhone, much better..

fa 11 years ago

Looks fabulous.

IgorPartola 11 years ago

Have I stumbled into some parallel universe? Let me get this straight: HN, a haven for hackers, developers, entrepreneurs, and the big wigs of the valley cannot get a webmaster to spend a day on making some really basic changes to the CSS and HTML to make the site responsive on mobile, which is probably the way lots of people read it. When a half hearted attempt is finally made, people complain and demand it be returned to the abominable state it previously was because the experience is somehow worse on mobile? What the hell is going on?! How is the experience worse? How is it that HN cannot get help with this? There have been so many volunteers saying "just let me fix it", yet it is a resource problem? Or is this some type of natural selection for hackers who do not own mobile devices or have strong eye? This is so backwards I feel like a teenage girl in that I cannot even.

jameshk 11 years ago

Well, we did ask for a mobile version, but not like this!