Tuesday, February 1, 2011

Typography: Should JQuery Form Builder Plugin Support Font Family By Language?

Overview
These few days, there is a pending decision in my mind that need to be made before I continue the development of new field of the JQuery Form Builder Plugin: Single Line Text field. As mentioned in the title of the post:
Should JQuery Form Builder Plugin support font family by language? Each language has it's own font family.
The 1.0 release of plugin is targeted to support top 2 languages of the Internet (more can be added later) such as English and Chinese. This decision is crucial as the current implementation of the plugin was support one font family for all languages, if I made up my mind to support each language has it's own font family, I will need to revise the structure of form settings and field settings of the Plain Text field, not a minor restructuring.

Findings
As typography is a new topic to me, I goggle it and done some reading. I heard of Google Font API and  WebFont Loader, but I curious to see is there other alternatives. First I found Cufon, then follow by Typeface.js, both of these are great web fonts technology, but they are not suitable for web form use as both technology using HTML5 canvas and VML. Also, Robert has good points why it is not for input components. Nevertheless, you may consider these technologies if you use it for presentation purpose only, you can learn more about these technologies in this discussion: SIFR vs Cufon vs Typeface.js.

Many thanks to editorial team of LogoTalks written a post related to typography with title "From TypeKit To Google Font API: The Road To Web Fonts" provides great introduction of web fonts. From the post, it was the first time I saw the @font-face CSS rule. After few more rounds of reading, I find out that it is the way to go as it is web standard and supported by browser natively (even not all browsers supported yet). Thanks to Paul done a detail write up about @font-face.

I can find out where to get or buy web fonts from these two posts: From TypeKit To Google Font API: The Road To Web Fonts and Where to get web fonts. The following are some sites offer free web fonts:
Conclusion
From findings above, it is clear to me that JQuery Form Builder Plugin should support font family by language especially Asian languages such as Chinese, Japanese and Korean should use font family different from English. The solution will be Google Font API and WebFont Loader (as it support custom provider, web fonts can be hosted in own server). Thanks to Cedric Dugas written a great introductory post about WebFont Loader. Lastly, thanks to James Brocklehurst created a Web Safe Fonts Cheat Sheet that will be very helpful for later improvement of the font picker plugin. Do you have better solution?

Like this blog?

Thanks for visiting! If you like what you see, I'd really appreciate you linking to it or otherwise sharing it with people you think would find it useful.

No comments: