A Cleaner, Simpler Blog Page
thintz.com
thintz.com
It just makes them more noticeable to me since it's such an unusual concept. This is both a pro and con with going against the grain - it makes you stand out.. which isn't the desired effect this time. The bizarre font combination doesn't help either. The ultimate in clean/simple is probably found in Readability/Safari Reader - at least, from all the raving I've seen over the last few days ;-)
UPDATE: I've now also set the text to be justified and am looking into hyphenation. Justified just seems to be a little more pleasant and smoother.
It might seem that way to the eye at first, but in reality, it just ain't so. Fully justified text is harder to read and has negative effects on retention: http://www.adamsdrafting.com/2007/05/03/justified-text-versu...
Study 1: http://www3.interscience.wiley.com/journal/120024982/abstrac... Study 2: http://www.eric.ed.gov/ERICWebPortal/custom/portlets/recordD...
The UK government also gives this advice in a style guide:
Avoid fully-justified text - the 'ragged' right edge can particularly help people with dyslexia in keeping reading position.
Making a site harder to read for people with dyslexia (an extremely common disability, even amongst techies) is not a good step towards "simple."
That's the thing about readability. It's not about what "looks good" or "feels good" to you as an author - it's about how readers actually read and react to your styling. Relying entirely on your own gut instinct is like trusting the Web design client who's raving "make the logo bigger" and "use Comic Sans - it's a great font!"
I'm going to look into this more, thanks.
Ragged edges make it easier to detect different lines of text, because you can see the lengths easily.
This makes it harder to lose your place, and easier to slide your eyes back to the left edge to continue reading. Every subtle clue to your location is helpful for quicker reading, and justified text pretty much destroys it. And personally, quicker often == easier, as if you can read it quicker, it somewhat implies a lower "cost" to the mechanics of reading that text.
Another way of looking at it is in the Y dimension. It's almost gospel now that we read fluently by scanning the tops of letters, so having letters of varying heights and upper shape improves readability. Turning this around, it might be fair to intuit that ragged right provides similar benefits in vertical scanning and place keeping.
Pick one font for content and (possibly) one other font for headings/menus. Different weights count as different fonts. Keep the number of fonts very low. Above all, do not use Comic Sans, ever.
The animations are distracting because they last too long; make them snappier. This is a common mistake when designing UI animations; people are afraid that their great animations will go unnoticed if they are too short and make them too long instead. Trust me, we will notice your short animations. Also there is a bug: your animations can't be interrupted, so if you mouse in and out 10 times they will continue flashing long after the mouse has stopped moving. Have you considered using CSS transitions instead of Javascript?
Empty space is just as important as text. You have left plenty of horizontal space, but your vertical spacing is inconsistent. The menu at the top needs more vertical space around the links (or perhaps the same space needs a smaller font with increased tracking AKA letter-spacing). The vertical space between items in the right column seems random, with very little space above the RSS link, extra space in the top of the green box and no space at the bottom. The left column has more space under the byline than above the headline which is weird, and there is zero space below the footer.
As I strive for simplicity, your suggestions about spacing makes a lot sense. It would be simpler visually to have things be more consistent.
Otherwise, it's gorgeous.
If you shoot me an email, I will send the theme files to you.
Is it a widespread practice? Has someone had a tutor and would like to share with us how tutoring/mentoring helped him?
Also, while the fully-justified body text produces nice, straight left and right edges, notice that because it's not a very wide column you get some significant spacing between words. If you want to keep it this way, you might look into using a hyphenating javascript library, which will help with the rhythm of the text.
I'd also recommend playing around with the line-height and measure, see: http://webtypography.net/toc/
On a sidenote: I would replace the Comic Sans MS font with another one; that font shouldn't be used for homepages IMHO
Yah I've been playing with the Google Fonts and I think I'll be switching that soon. I just had to have something a little different and that was the quickest, easiest at the time.
It isn't free, but it is reasonable. And they have a much better selection of fonts.
Widescreen movies on a 4:3 aspect TV always use black edges, but maybe that's just tradition or to do with contrast or something like that.
EDIT: Just noticed that HN has a grey content area with white around the edges, which I like, so maybe my preference is more to do with having different colour sides than dark sides - i.e. some kind of boundary to the content area.
I currently use justified alignment, but given the mounting evidence against it I might switch to ragged right next time I'm playing with the CSS.
even more so when you've got employee mouths to feed. put money in the equation and a lot of design exploration of this type just becomes a waste of energy.
that said, nice idea!
but I'm pretty sure the current best practice for maximising CTR is to, well, make sure stuff is visible. feels silly to even dispute this.
I haven't got around to add a navigation section yet.