Hacker News Reader

Comment by notatoad | Hacker News Reader

the individual post pages contain a lot of whitespace, yes. But text looks better at a narrower width. what do you want them to do, fill up the gutters with ads just to colour your pixels?

the main index page wraps nicely to multiple columns when you're on a larger screen.

View on HN

If I were designing it I would have it either switch to multiple columns when the size of the white space got too large, or I would have the columns widen with the page.

The latter results in a sort of 'tweetlike' appearance for a lot of G+ posts as they are quite short, the former makes it more 'newspaper' style and introduces the question of how you move from the bottom left to the top right. If you do it with the same posting it makes scrolling challenging, if you do it with multiple postings it makes the user scroll up and down to see the top and bottom.

Then again, there is a really useful layout that folks have been using forever where you put summaries on the left and content expands in boxes on the right. But then it looks just like gmail or something, except that is exactly what it is "group email". Gooogle plus seems confused about what it is, is it twitter ? is it facebook? is it usenet? is it email? Fix its multiple personality disorder and the design will fall out of that naturally.

What the parent poster was asking - since this link is a single-post page, is what you're expecting to fill the space.

On the main stream, you have multiple columns of data. On a single post, what should be to either side?

Probably nothing.

You widen the single-post, maybe add inner padding, increase line-height, font-size. It just looks weird otherwise, the post is too narrow. Make it look like its comfortable in its environment instead of very shy and afraid to take any space.

I would prefer the margins narrow to no more than 10% of the page width. The left margin already has some navigation in it, fine, the right margin doesn't need to exist. If that means blank space below the article I'm ok with that. Having to scroll down to read an artificially skinny single post is, in my opinion, bad UX.

I find it difficult to read articles that are wider. There are a number of readability studies that back this up, it seems that 50-75 characters (including spaces) is a sweet spot for readability, and that things get terrible pretty quickly once you start increasing the line length. This design is 80 characters wide or so, putting it at the upper limit of reasonable width.

I would rather have to scroll down on an article that I can actually read, rather than fit the article on my screen but be unable to read it well.

Wide text only really works for very short text of a few lines. Long text comments on HN tend to suck pretty badly with wide browser windows.

Maybe ads? But I got adblock, so I don't know

You would rather see ads than whitespace?

Maybe recommended posts instead?

If I could take your suggestions in a slightly different direction, what I'm finding I prefer for textual content is:

1. Single-pane designs. Multiple columns, especially online, for main content text, is too hard to follow. In a cards-type presentation (e.g., G+) a 2-column display somewhat works, but 3 columns to me simply becomes noise. I think a multi-column (newspaper-like) display might work if you had explicit height alignments, see a site like http://freshnews.org, very old-school, but which essentially has a 3-column grid, and compare with, say, the NYTimes desktop layout. Note that new column heights aren't simply random, but tend to be lined up across the page, or at least a section of it.

2. A flexible main-body text width, but maximising at about 35-45 em. Look up "Edward Morbius's motherfucking web page" on CodePen.io for my interpretation of a popular meme, and pretty much how I style my own content. It's a very minimal ruleset. Pocket and Readability are good models.

3. A paginated, two-page-up mode, for desktop / widescreen mode. See many eBook readers or the Internet Archive's Bookreader in 2-up mode. This gives focus on a single page at a time, but the ability to reference across two pages. I use a tablet in portrait (1-up) mode a lot, and prefer being able to reference back and forth across two pages. A fixed pagination also feeds my spatial memory for where something was on a page. Pocket has a paginated mode, but it's dynamic, changing to wherever you've scrolled a page. I dislike that.

4. Except for the very narrowest display, at least a minimum margin on sides. I'll usually set 1-2em for even a small-factor mobile device, and prefer 4-5em for most widths. As text body reaches 45em, center the main body. Text that runs flush to the screen edge, or is sharply asymmetric on the page, is quite annoying.

5. Use those margins. I've written a sidenote style which puts annotations in the margin, with a dynamic repositioning for narrower widths (or rather the inverse, using Mobile First design). I also push illustrations / images into the right margin to allow text to wrap, but still leave a comfortable width, around inline images.

My problem with a "summaries on the side" display (sidebar) is that the summaries are so often entirely gratuitous and inappropriate. Single-column is far calmer. I move sidebars to headers and footers (through my own site-specific CSS rewrites), or simply disable them entirely.

> But text looks better at a narrower width. what do you want them to do, fill up the gutters with ads just to colour your pixels?

True story: I'm completely capable of narrowing my browser window if I want narrower text. The site I'm reading doesn't actually need to do that for me!

This is a very 'computer programmer' mindset. Most people want an appealing UI out of the box, less need to configure at the expense of configurability.

I'd bet a fair percentage of computer users are uncomfortable resizing windows and rarely/never resize. And a smaller but still significant set is probably unaware that it's possible or how to do it.

Isn't the browser experience on Chrome OS pretty much full screen?

It is a windowed environment, same as any other.

Sure, but in practice I think the idea is you run the browser full screen most of the time.

Huh? Chrome's fullscreen functionality is the same as any other browser's. And fullscreen hides tabs, so it's definitely not something you want to do most of the time.

No, it's by default a single window experience. You can get it to do standard, classical, utterly terrible overlapping windows. But it's not the default experience.

Not that it matters, really. Narrowing the field is just good practice for readability.

Those people should be using tablets, not computers.

Edit: if you disagree, what the heck are you doing on a site called "Hacker News?" Comment, don't just vote.

Because you asked for reasons:

The context of this conversation is how a product should have been done. The devs that make that product want people to use it.

You're suggesting that they ignore part of that user base, based on a claim that people shouldn't browse the internet however is most convenient for them. E.g. by using a computer they already have instead of a tablet they might not. All parts of that reasoning are ridiculous.

And my browser is always fullscreen with lots of tabs. I'd rather have a readable width article by default.

I use tabs in my browser and would never resize the window to accomplish that, as it'd resize the other tabs too. I could detach the tab and resize the new window if I really really wanted to, but thankfully I won't have to bother :)

If all websites respected the browser width one has set, then one could always have the browser take up half the screen.

That's how I did it back in the 90s and early 2000s. I'm not certain when I was forced to start widescreening my browser, but I think it was roughly around the time I got a widescreen (ironically enough, I got more horizontal space and was forced to waste it immediately).

I'm not bitter …

I can do a lot of things, but I'd rather not have to fiddle with my window sizes to workaround broken layout.

Comparing it with Medium, which is a nice readability yardstick, it's about 200 pixels narrower and font-size is about 4px smaller.

Allow it to widen. I have my browser wide for a reason. If I wanted my browser narrow, I'd make it narrow.

I have my browser wide because most sites have a ton of crap on the sides. If they were clean like G+ I wouldn't have it wide.

But at 13px, the text could be a bit bigger, and the column correspondingly a bit wider in my opinion. Although I agree with you in principle.

Reply on news.ycombinator.com