I like to scan comments by point values so it's easy to pick out good threads (shallow? maybe. effective? yes). Putting points next to the upvote arrow--and hence on the right side--seems like a better way to display them. It also helps frame the comments better.
The idea originated from a restriction that I wanted a particular styling on homepage with the source website link flushed right. On second thoughts I realised that this works way better for comments since the upvote should NOT have anything to do with current points or who posted a comment. Brings a fair setup IMHO.
But since you read left to right and people want to filter out comments that don't have lots of upvotes, doesn't it make sense to have the point values on the left? If anything, what about moving the vote action to the right? Or at the end of the comment ala Amazon.com?
First, the comment's points are important and right now are hard to read/notice.
Second, I'm not a designer, but I've always heard you shouldn't use black typo on white background as it's a little bit to hard contrast, it's better to use a (very) dark grey on the type.
Yes, that is an issue I am looking to fix. Basically has got to do with HN markup being the ugliest thing I have seen. Tables all along with no classes and whatsoever. So targeting is a pain in the ass.
Will see if using pseudo class for first element helps me out.
It is hard to target comment points specifically without changing the color of entire line.
Also I normally avoid looking at Comment points to avoid any bias and bring neutrality in my reaction to a comment. Again this maybe different for you guys.
Also as a golden rule the popular comments (unless threaded) are on the top so not really that important for me.
Second: In design specifically the rules are not hardwired like physics. You can break them but you must know that you are breaking a rule when you do. Normally I use #333333 in all my works but somehow missed it here. Will correct and put up an updated version tonight.
This whole setup is really nice however I would like to +1 the request to see points next to the up/down mod. It would also be nice to see the font-size of the meta line be larger as its so small at the moment it's hard to read.
After seeing the headline I immediately thinks of Stylish (+ Greasemonkey, just to note) as well.
The thing is, if it is just style changes, it is better to be done via Stylish. Extensions, for most of them in chrom(e|ium), would would absolve resources in the system via a separate process. For computers with less memory, running multiple chrome extensions would not be a good idea. Better to run extensions that benefit all sites than just one.
[edit] just went to check whether a new process would be created - in fact, no, since there is no JavaScripts loaded. Please ignore the comment on resource and memory stated above, thanks.
Also as a side note for using that in Firefox 3.6 , it seems that submit button's orange background is not applied like in chrome, so it would be harder to read the text on the button. Someone with Firefox 4 on hand may to see check on that as well.
I have tried to tweak the layout without any browser extensions. This will work on any browser but it's a 'lite version' so you can only use these to read HN. Have a look:
Thanks mate; but I actually did this to make it easy for me to read HN posts on my netbook (1024x600). Reducing the width would mean lots of scrolling :(
Use a fluid width with min and max width so that the reading span does not grow too big or small. No matter what screen you have, anything longer than 70-80 chars in a single line is a pain to read.
That is the reason readability and Safari Reader are designed the way they are. Use em/% to go screen size free.
I like the idea, and there are several aspects of the georgify format that are pleasing. My main comment is that there is far too much vertical whitespace. The compactness of hn is pleasant to the eye, and it lets readers scan headlines quickly. A little tweaking will prevent readers from having to scroll so much.
It's easy enough to add generous whitespace and make a design instantly more elegant and viscerally appealing, but when you are trying to extract value from information there is something to be said for information density.
This is my beef with the new Sparrow Gmail client on OS X as well. When I open up Gmail in Chrome I can see 33 messages at once (40 once I scroll). By contrast Sparrow shows me 13 (always utilizing the full vertical of the screen). Now arguably it presents them in a better fashion (although the label display is lacking, but I digress), but is it worth sacrificing 2/3rds the visibility? Not with my email volume.
Granted, information density is less important for HN, but then so is aesthetic appeal (the last thing I want is more people joining HN because it has an elegant appearance).
The parent post is being shown as a reply to a peer and not the post it actually replied to. Seemed like normal threading until I noticed the reply was older than the grandparent.
Surprised since the only change I did was add padding to the top and bottom. Wonder how that changed threading. I am not using one line of JS for this.
I also agree. There is too much white color, the readability is not very good.
I was exited about it as i already mentionned here that there is room for improvment of HN.
i'll uninstall it now. looking forward to try a corrected version.
I'm pretty sure it was the arguably-wrong nitpick combined with crappy grammar that sunk it.
I try not to down-vote just for differing opinions from my own, although my emotions do get the better of me occasionally. However, if I see bad grammar it's just automatic.
I'm a foreigner so that maybe explains why I can't relate to what you're saying, but does omitting the 'the' at the beginning of my phrase really make it bad grammar? I imagine it colloquial speech.
1. While it is easier to read, the combination of the larger size of the text and the vertical spacing makes it harder to scan all the topics quickly, as was possible without this style.
2. as already mentioned, the info sub-text is a bit soft in contrast and hard to read quickly, even though it looks nice. Suggestion: make the important info such as the numbers and username a bit more darker, but leave the repeated info such as 'points by' and 'comments' as they are.
I like it. A little off topic, but the Google Chrome Extensions that override CSS get my brain thinking about something like this on a different scale. For instance, could someone build complete Facebook or Twitter face-lifts? If it's possible, the consequences of that permutation would be interesting. Especially now that the modern browsers are moving towards auto-update, which encourages a higher likelihood of something like this taking off.
If marketers starting picking up the idea, I see "shoot here to win the prize", phone number, email address collecting type of ads promising to "bring facebook back the way it was", "just enter your email address and we'll send you the link!" If you don't think this could work, just remember that a few years back people were installing emoticon packs and CometCursor just so they could have a customized, albeit terrible, experience.
Aren't there chrome plugins that remove facebook ads? I'm not sure if it's done through CSS or some other way, but it seems like something you're describing.
There are definitely already extensions that completely remodel the UI experience of sites like Facebook. They've only been targeted at making things more usable and adding features that people want, rarely undoing new Facebook redesigns.
The people who would install a Chrome extension to improve the design of facebook aren't going to be the kind of people who blindly say "ugh, Facebook looks differen, wtf!", and those kinds of people are especially not going to be the kind of people who would write up lots of complicated CSS and JS (both, not just CSS, would be necessary to roll back Facebook's upgrades) to redesign facebook. But this raises a good point: when Facebook rolls out a redesign, do they change the backend enough that an extension that overrode the CSS and JS with the previous design's CSS and JS would break?
It is perfectly possible, but the result would be very fragile. Even a small change to the original could break the mod, and users will blame you. Not to mention that without control over the server side it's very difficult to provide much added value besides a nicer theme.
Better Facebook (http://betterfacebook.net/) changes a lot of of the look and feel of Facebook, allowing to add, remove or move elements and apply themes.
I still think this suffers from the same issue on the Stylish option, when you are way down on the comments you have a hard time knowing if the comment is an answer to the OP or to another comment, the increased indent helped but a left align or vertical line all the way from the OP post would help a ton.
I like it, but I have to agree it's about 25% larger than I'd want, including both the input field for adding a comment (which takes up 1/5 of my screen height on a large monitor) and the comments, which end up being way too long.
Just reducing the font sizes a little would help - having the default font so large kind of apes apps like readability, it's much bigger than is necessary.
(Just zooming out on my browser isn't enough, since it also reduces the width of the lines.)
101 comments
[ 2.0 ms ] story [ 222 ms ] threadI'd do just two small changes:
First, the comment's points are important and right now are hard to read/notice.
Second, I'm not a designer, but I've always heard you shouldn't use black typo on white background as it's a little bit to hard contrast, it's better to use a (very) dark grey on the type.
I'm using Chrome 10.0.6.648.204 on OS X.
Will see if using pseudo class for first element helps me out.
Also I normally avoid looking at Comment points to avoid any bias and bring neutrality in my reaction to a comment. Again this maybe different for you guys.
Also as a golden rule the popular comments (unless threaded) are on the top so not really that important for me.
Second: In design specifically the rules are not hardwired like physics. You can break them but you must know that you are breaking a rule when you do. Normally I use #333333 in all my works but somehow missed it here. Will correct and put up an updated version tonight.
https://addons.mozilla.org/en-US/firefox/addon/stylish/
https://chrome.google.com/extensions/detail/fjnbnpbmkenffdnn...
http://userstyles.org/styles/browse/all/news.ycombinator.com
So be sure to submit it there too, I will definitely try it.
The thing is, if it is just style changes, it is better to be done via Stylish. Extensions, for most of them in chrom(e|ium), would would absolve resources in the system via a separate process. For computers with less memory, running multiple chrome extensions would not be a good idea. Better to run extensions that benefit all sites than just one.
[edit] just went to check whether a new process would be created - in fact, no, since there is no JavaScripts loaded. Please ignore the comment on resource and memory stated above, thanks.
Also as a side note for using that in Firefox 3.6 , it seems that submit button's orange background is not applied like in chrome, so it would be harder to read the text on the button. Someone with Firefox 4 on hand may to see check on that as well.
http://pastebin.com/zkzHDSP2
raw: http://pastebin.com/raw.php?i=zkzHDSP2
Please note this has a fixed width issue in Chrome. Works fine in Firefox. So I would recommend Chrome extension for chrome users and Stylish for FF
edit: Also, the extra space in comment-headers is wonky. And even with my nitpicking, great job!
Also that makes the URLs work as an Inbox/Unread badge for me. With what I can see as the unread ones I need to read before the end of day.
Will tweak it a bit though. Also different screens with different color gamut make it troublesome in corner cases.
edit: The comments whitespace treatment is next in line on by issue list.
Non AJAX version: http://www.skillendar.com/hackernews/noajax.aspx
AJAX version: http://www.skillendar.com/hackernews/
Golden rule of 40-60 chars each line.
That is the reason readability and Safari Reader are designed the way they are. Use em/% to go screen size free.
They are, after all, just html pages and javascript with access to certain APIs that may already be available in Firefox in some form or other.
This is my beef with the new Sparrow Gmail client on OS X as well. When I open up Gmail in Chrome I can see 33 messages at once (40 once I scroll). By contrast Sparrow shows me 13 (always utilizing the full vertical of the screen). Now arguably it presents them in a better fashion (although the label display is lacking, but I digress), but is it worth sacrificing 2/3rds the visibility? Not with my email volume.
Granted, information density is less important for HN, but then so is aesthetic appeal (the last thing I want is more people joining HN because it has an elegant appearance).
Like others have said, the grey is too pale.
EDIT: It would be nice if the layout made use of columns .. this could provide innovative use of wide-screen resolutions.
The parent post is being shown as a reply to a peer and not the post it actually replied to. Seemed like normal threading until I noticed the reply was older than the grandparent.
Any suggestions as to what could be causing this?
i'll uninstall it now. looking forward to try a corrected version.
I try not to down-vote just for differing opinions from my own, although my emotions do get the better of me occasionally. However, if I see bad grammar it's just automatic.
A couple of points for me are that:
1. While it is easier to read, the combination of the larger size of the text and the vertical spacing makes it harder to scan all the topics quickly, as was possible without this style.
2. as already mentioned, the info sub-text is a bit soft in contrast and hard to read quickly, even though it looks nice. Suggestion: make the important info such as the numbers and username a bit more darker, but leave the repeated info such as 'points by' and 'comments' as they are.
If marketers starting picking up the idea, I see "shoot here to win the prize", phone number, email address collecting type of ads promising to "bring facebook back the way it was", "just enter your email address and we'll send you the link!" If you don't think this could work, just remember that a few years back people were installing emoticon packs and CometCursor just so they could have a customized, albeit terrible, experience.
The people who would install a Chrome extension to improve the design of facebook aren't going to be the kind of people who blindly say "ugh, Facebook looks differen, wtf!", and those kinds of people are especially not going to be the kind of people who would write up lots of complicated CSS and JS (both, not just CSS, would be necessary to roll back Facebook's upgrades) to redesign facebook. But this raises a good point: when Facebook rolls out a redesign, do they change the backend enough that an extension that overrode the CSS and JS with the previous design's CSS and JS would break?
Just reducing the font sizes a little would help - having the default font so large kind of apes apps like readability, it's much bigger than is necessary.
(Just zooming out on my browser isn't enough, since it also reduces the width of the lines.)