Settings

Theme

Type.js – remedying CSS’s typographic oversights

github.com

42 points by kingzain 11 years ago · 17 comments

Reader

RubyPinch 11 years ago

I can't imagine how a font acts across browser/OS differences is predictable enough to sanely/safely make decisions about kerning

mjs 11 years ago

Demo page:

https://cdn.rawgit.com/nathanford/type.js/master/index.html

  • memco 11 years ago

    Thanks for the link. Even this was a bit underwhelming to me. You have to click the (not very visible) link to toggle the effect on and off. Turning it on forces a reload of the page. Would be nice to have a side-by-side comparison of off and on.

drinchev 11 years ago

Congrats on the work and more importantly about the idea!

Two things that I find ( in my opinion ) unpleasant :

1. Source code is hard to read ( some strange indentation and a lot of empty lines )

2. Support for dynamic content will do a lot of repaints.

  • kingzainOP 11 years ago

    I cleaned up the code a bit and created a PR. It isn't my project, however I thought it was interesting and warranted a discussion on HN. Thanks for the input.

rrhyne 11 years ago

This going to be huge for designers. Lack of proper kerning in CSS makes web fonts feel like half of a solution.

  • lojack 11 years ago

    Honestly, I feel as though manual control over kerning will become an anti-pattern for most designers.

    Most good OpenType fonts have kerning data built in, and its pretty simple to enable this feature for most modern browsers (Safari is lagging, see font-feature-settings). There certainly are times when you want to override the default kerning, but its few and far between, and certainly not a good idea for body copy.

    I'd rather have improper kerning for old browsers, and nice kerning for new browsers than trust designers to properly manually adjust the kerning themselves.

    • rrhyne 11 years ago

      > trust designers to properly manually adjust the kerning themselves.

      You've got it backwards. Never trust a font to provide your kerning, always adjust. Proper kerning is a fundamental tenant of good typography. Designers have always and will always manually adjust kerning.

      • dangayle 11 years ago

        No no no, that's bullshit. A properly designed font isn't just the outlines, it's the outlines + spacing. Type designers spend almost as many hours perfecting the built in kerning as they do creating the outlines themselves, because the space is integral to the font as a whole.

        Yes there are times, especially with display type, that you want to adjust the kerning between a few pairs of glyphs, but to say to "never trust a font to provide your kerning" suggests to me that you use a lot of poorly designed free fonts rather than professionally realized typefaces from reputable font foundries.

        I would love it if the browsers would all support the built in kerning in a font by default, with a way to override it manually.

        • rrhyne 11 years ago

          Even when you do have access to all the best fonts (most honest startup designers don't) you still don't trust the font. You always kern.

      • voidhorse 11 years ago

        In most cases its actually the opposite.

        If you are using quality fonts, as you should be, you will only need to adjust the kerning in very rare cases. The type designers are the ones who have to concern themselves heavily with the font kerning. Which is why font design software, such as fontlab or glyphs, have an insane amount of kerning related functionality, whereas the kerning provided by something like, say, photoshop or indesign, will do what you need it to--which is make minimal adjustments in corner cases.

        • wodenokoto 11 years ago

          In print you do a lot of hand kerning, including magazine articles as well as ads.

          And print designers do have access to high-quality fonts.

  • TylerH 11 years ago

    It's not CSS' fault, it's the font's fault.

    • rrhyne 11 years ago

      True, but fault != fix, which is why we used to spend hours kerning type in illustrator or photoshop.

saurik 11 years ago

This should be using a -nathanford- vendor prefix for these library-specific CSS properties :/.

jamesdelaneyie 11 years ago

Very cool :) Added some suggestions in the issues tab!

tambourine_man 11 years ago

How is the performance on large bodies of text?

Keyboard Shortcuts

j
Next item
k
Previous item
o / Enter
Open selected item
?
Show this help
Esc
Close modal / clear selection