Justification and hyphenation

Why is virtually nothing on the web justified and hyphenated? Grab any book off the shelf in your home or office and I’ll bet you it’s justified and hyphenated. In fact, I challenge you to find me a book that isn’t.

Hundreds of years of making books and it seems to me everyone agrees justified and hyphenated is the way to go. Now all of a sudden it’s controversial whether or not it’s really better for reading, easier on the eyes, &c. The technology exists to easily hyphenate any website or app,1 but many developers either aren’t aware it’s possible or choose not to do it because they somehow think ragged-right is better.

And I’m not just talking about average blogs or news websites. I’m looking squarely at sites like Instapaper and Readability, and apps like Flipboard and Articles, who claim to offer a superior reading experience (and for the most part I think they do), yet continue to feature rag-right text. I’m also looking at e-book readers like Amazon’s Kindle or Apple’s iBooks,2 or Bible apps like OliveTree BibleReader or Crossway’s ESV Bible.

For all this new-fangled technology we have, e-reading is just not like reading a real book. It seems to me justification and hyphenation are a cheap and easy way to get closer to the real thing, so why aren’t they being utilized more universally? 

  1. For example, I use the excellent hyphenator.js right here on this site. []
  2. Although, for all I know Kindle and iBooks may very well have justification and hyphenation baked in as options and the decision not to leverage those features could be up to publishers at the level of the individual books, in which case my complaint is still valid, but should be leveled at publishers, not the platforms they publish on. []

Blah blah blah

A few more notes about the new design, and then I’ll stop yakking about it; I promise. I’ve now tested the site in Internet Explorer 6, Internet Explorer 7 (rc1), Firefox 1.5, Firefox 2 (rc2), Opera 9, and Safari 1.2. It passes with flying colors in all browsers, with the exception of IE6, where it doesn’t actually look half bad—the layout itself is fine but the PNG images puke big bluish blocks all over where they should be transparent. Sometime down the road I may decide to replace all the PNGs with something else in IE6 (using conditional comments or some other such hack), but IE7 is coming this month and will be a critical automatic update, so I’m not going to sweat about it too much.

Unbeknownst to me, the new design wasn’t at first valid XHTML and CSS. I took care of that this morning by properly closing a few <li> tags, fixing a few tag IDs, properly enclosing a couple of comment form elements inside a block level element, and fixing a few malformed CSS statements.

Last but not least, I should mention that the new design uses a couple of new fonts: Cambria and Calibri. Microsoft is releasing six new fonts with Windows Vista and many people (myself included) are hoping they become widely distributed enough to use them in web pages. If you don’t have these fonts, the new design properly degrades to using Georgia and Trebuchet MS instead, which I think looks pretty good, so you’re not missing out on much. To get the full effect, however, I recommend you download the new fonts if you can. They have been released unofficially to the public in the Vista betas and can be found on the web with a little effort.

Windows Vista fonts

Microsoft has announced the official name of the Longhorn code-name project: Windows Vista.

One of the more exciting announcements (imho) is that six new fonts will ship with the OS. Assuming Vista gains widespread market-share, these will be the first new fonts in a long time to be acceptable for use on the web.

You can already download the fonts from various places on the net (I got them here). They’re all pretty simple, but they’re a nice break from the same three or four fonts everyone’s used to seeing.

(Hat tip: Aaron Toponce)