28 September 2009

Typography hits the web

“Proper quote marks” I think — and also proper long dashes — make the web a more beautiful place. You don't even need any special software to use them since most programs and web services now use Unicode and just allow you to type the character and then display, store, and transmit it correctly.

More nice typography: CSS 3.0 will include some hyphenation support and for those who can't wait there is already a nice bookmarklet that does hyphenation on the fly in any modern browser! If you ever have to include a very long word (such as Dampfschiffahrtsgesellschaft oder Gesellschafterversammlung) in a text that might end up in a narrow column (such as next to an image) or simply on a mobile device, you can already easily save your layout by inserting a soft hyphen (HTML entity ­). This will tell any modern web browser where to break the word. Here's the example used by the W3C: anti­establish­ment­aria­nism, anti­establish­ment­aria­nism, and anti­establish­ment­aria­nism. Resize your window (or zoom) to see how your web browser automatically hyphenates the word! (No Javascript required.)

Further Reading:
  1. 8 Simple Ways to Improve Typography In Your Designs
  2. The soft hyphen - Variation in web browsers
Appendix: Soft hyphen support in browsers and search engines

Internet Explorer before version 5.0 always displays soft hypens. That's terrible, but IE version ≤ 5 are virtually extinct now, so the problem is less. IE ≥5.0, Firefox ≥3.0, Opera ≥9.0.2, Safari ≥2, and even Lynx ≥2.8.2 all treat soft hyphens correctly, while those other browsers who don't support them will just ignore them. (Source: [2])

Google and other major search engines correctly ignore soft hyphens. (Same source)
In other words: soft hyphens are safe and beneficial to use as of now.


Post a Comment