Topography and Hyphenation


I’m a sucker for topography, something I really enjoyed in college when using LaTeX to get really cool looking printouts…

I’m a sucker for topography, something I really enjoyed in college when using LaTeX to get really cool looking printouts. A lot of that fun was lost with I started using applications like Word that do a pretty good job of kerning and hyphenating text without you having to do anything. Using (X)HTML I often just let the browser do what it does, even if it leaves a lot to be desired. This changed today when reading A List Apart’s wonderful article The Look That Says Book.

I have to say, the article hit home and provided an elegant solution: hyphenator. Hyphenator is an easy to use JavaScript library that parses your text and adds in all the soft hyphens to help your browser do a better job of justifying your text. This site has always used justified text, but since I don’t bother to tell the browser where to hyphenate words, it just fits words as best it can. This causes some rather sparse lines from time to time. To compensate, I created a custom version of the hyphenator.js library, added the class tag, and voilà! Now I have nicely hyphenated text that looks more topographically correct with less white space in some lines.

I have to admit it does have a few drawbacks. It may take a bit to load sometimes, especially if you are using a browser with a slow JavaScript engine. If you read the article, it will point out some other issues like searching and copy paste. In truth, I doubt this is much of an issue for my site, but it is worth noting if you’re using a site with a bit more traffic. Consider the risks yourself. For me, I’m happy with my new, if minor, look. Let me know if you have any issues yourself.



Comments on this article:

No comments so far.

Write a comment:

Type The Letters You See.
[captcha image][captcha image][captcha image][captcha image][captcha image][captcha image]
not case sensitive